2015-03-30 2 views
0

Я встречаю некоторые трудности. Задача состояла в том, чтобы включить кнопку воспроизведения после того, как введенное имя было введено так же, как и заполнитель (например, я установил заполнитель как Lianzheng, кнопка будет активирована только тогда, когда я введу Lianzheng в форму.кнопка включения после прозвища была введена

Следующий код .. мой HTML и Javascript код Это не работает Так что я хочу, чтобы выяснить, что пошло не так

HTML:.

<p> <input id= "play" class="button" disabled="disabled" type="submit" value="play" onkeyup="myFunction() 
onclick="play()"> </p> 

Javascript:

function myFunction() { 
var x = document.getElementById('name').value; 
document.addEventListener('keydown',function(e) { 
name.textcontent = 'keydown:' + e.keycode; 
}); 

document.addEventListener('keyup', function(e) { 
name.textContent = 'keyup:' +e.keyCode; 
}); 

if (name == 'Lianzheng') { 
alert("!!"); 
document.getElementById("name").disabled = false; 
} 
else { 
document.getElementById("name").disabled = true; 
} 
+0

где играет() ?? – user86745458

+0

Вы можете использовать jquery в своей задаче? то все будет проще и может вам помочь. –

+0

Спасибо. Но мне разрешено использовать JavaScript. –

ответ

0
<!DOCTYPE html> 
<html> 
    <form> 
    <input type= "text" placeholder="Lianzheng" id= "inputField" onkeyup="myFunction()" onkeydown="myFunction()"> 
    <input type="submit" name="play" disabled="disabled" id="play" value="play"> 

    </form> 
    <script> 
     function myFunction() { 
      var placeholderValue = document.getElementById("inputField").placeholder; 
      var valueEntered = document.getElementById("inputField").value; 
      if(placeholderValue === valueEntered){ 
      document.getElementById("play").removeAttribute("disabled"); 
      } 
      else{ 
      if(!document.getElementById("play").hasAttribute("disabled")){ 
        document.getElementById("play").setAttribute("disabled","disabled") 
      } 

      } 

     } 
     setInterval(function(){ 
      var placeholderValue = document.getElementById("inputField").placeholder; 
      var valueEntered = document.getElementById("inputField").value; 
      if(placeholderValue === valueEntered){ 
      document.getElementById("play").removeAttribute("disabled"); 
      } 
      else{ 
      if(!document.getElementById("play").hasAttribute("disabled")){ 
        document.getElementById("play").setAttribute("disabled","disabled") 
      } 

      } 
     },1000); 
    </script> 
</html> 
+0

Работает отлично во всех условиях, на клавиатуре, при нажатии клавиши, при замене значения текстового поля –

+0

Большое спасибо. Отлично. Хотя и отсутствует, я действительно ценю вашу помощь в такое время! –

0

Я еще не могу прокомментировать, я новый участник, так что это может быть не ответ, скорее всего на предложениях. ahm, я не могу понять, откуда взялось это имя, но проверите ли вы, что ваш имя имеет значение, работает ли предупреждение? вы также можете попытаться поставить предупреждение до и после вашего оператора if только для проверки. то, если он имеет значение и все еще не работает, возможно, вы можете использовать .show() или .hide()? вместо .disabled = true и .disabled = false? .. надеюсь, что это поможет.

+0

Спасибо.Но нас просят отключить кнопку, то есть кнопка станет серой и не сможет щелкнуть, а не скрывать или исчезать. –

+0

О, я вижу, мне жаль, я думаю, что это проще в jquery, должен ** $ ('YourIdHere'). Prop ('disabled', false); ** works .. –

0

Я думаю, что вы пытаетесь включить/отключить текстовое поле вместо кнопки.

Внесите свой код, чтобы включить идентификатор кнопки, в которой вы включаете/выключаете кнопку.

См. Ниже.

function myFunction() { 
var x = document.getElementById('name').value; 
document.addEventListener('keydown',function(e) { 
name.textcontent = 'keydown:' + e.keycode; 
}); 

document.addEventListener('keyup', function(e) { 
name.textContent = 'keyup:' +e.keyCode; 
}); 

if (name == 'Lianzheng') { 
alert("!!"); 
document.getElementById("play").disabled = false; 
} 
else { 
document.getElementById("play").disabled = true; 
} 

Кроме того, замените переменную name с document.getElementById("ID_OF_YOUR_TEXTBOX_HERE").value

0

попробовать это:

<script> 

function test(){ 
    var placeHolderName = document.getElementById("playText").placeholder; 
    var playTxt = document.getElementById("playText").value; 

    console.log("playTxt="+ playTxt); 
    console.log("disable ="+ document.getElementById("play").disabled); 

    if(playTxt === placeHolderName){ 
     document.getElementById("play").disabled = false; 
     alert('done!'); 
    } 
} 

</script>  

<input id="playText" type="text" placeHolder ="abcd" onkeyup="test();" /> 
<input id= "play" class="button" disabled="disabled" type="submit" value="play"> 

согласно подсказкам, которые вы дали, это должно работать. таким образом, вы можете изменить значение placeHolder в более позднее время. Я сделал для вас скрипку: Fiddle

** замените значение «abcd» на любое ваше имя!

1

Попробуйте этот путь. Вы должны включить функцию onKeyUp в inputText не в Button.

<html> 
<head> 
    <script type="text/javascript"> 
     function myFunction() { 
      var name = document.getElementById("name").value; 

      if (name === 'Lianzheng') { 
       alert("!!"); 
       document.getElementById("play").disabled = false; 
      } 
      else { 
       document.getElementById("play").disabled = true; 
      } 
     } 
    </script> 
</head> 
<body> 
    <input type="text" id="name" onkeyup="myFunction()"/><br/> 
    <input id="play" class="button" disabled type="submit" value="play" /> 
</body> 

Но в любом случае, лучше, чтобы проверить имя только после того, как кнопка нажата. И проверьте имя в javascript, если имя правильное, отправьте, если не верните false. Таким образом, вы можете избежать ненужного представления.

+0

Спасибо, я стараюсь и рассматриваю это сейчас. –

Смежные вопросы