输入具有指定值时隐藏div

时间:2014-07-11 02:45:39

标签: javascript jquery prototype

我试图在值= 10

时隐藏div

以下是代码,demo正常工作:

<script>
$('input[name=test]').keyup(function(){
  if($(this).val()<10)
    $('#yeah').show();
  else
    $('#yeah').hide();
 });
</script>

<label>Type whatever</label>
<input type="text" name="test"value="10"  />

<div id="yeah" style="display:none;">
<input type="submit"   />
</div>

但是我试图将该代码转换为Prototype代码并尝试this code

Event.observe(window, 'load', function () { 
$('input[name=test]').keyup(function(){
if($(this).val()<10)
$('#yeah').show();
else
$('#yeah').hide();
});
});

我只想在输入值= 10时将div隐藏到原型代码中。

请有人帮助我吗?

2 个答案:

答案 0 :(得分:2)

为文本框添加ID。例如:

<input type="text" id="txtbox" name="test" value="10" />

变化:

<div id="yeah" style="display:inline;">

要:

<div id="yeah" style="display:none;">

您需要使用返回$$array函数。

Event.observe('txtbox', 'keyup', function () {
     if ($$('input[name="test"]')[0].value < 10){
         $$('#yeah')[0].show();
     }
     else{
         $$('#yeah')[0].hide();
     }
});

注意:您也可以使用.first()代替[0]

JSFiddle

答案 1 :(得分:1)

你有原型lib的问题,

永远不会触发Event.observe函数,其次,您似乎仍在使用jquery api

$().keyup()

并且您只加载原型函数。

现在人们很少使用原型,人们使用jquery进行dom和下划线/ lodash迭代。