3

我只是在学习 jQuery,我很菜鸟。

看,我们有 2 个 div 如下:

<div id="div1">
<ul>
    <li> This is Line 1</li>
    <li> This is Line 2</li>
    <li> This is Line 3</li>
    <li> This is Line 4</li>
    <li> This is Line 5</li>
</ul>
</div>

<div id="div2">
<ul>
    <li> <input type="text" /></li>
    <li> <input type="text" /></li>
    <li> <input type="text" /></li>
    <li> <input type="text" /></li>
    <li> <input type="text" /></li>
</ul>
</div>

由于我刚刚学习change()函数,所以我想做的就是:当div2中输入框的每个值发生变化时,应将相同数字的div1 li更改为输入的值,例如如果我们开始输入在 div2 的第二个输入框中,第二个 li 文本应该是我们在第二个输入框中输入的内容。

这是我迄今为止尝试过的,但没有奏效:

<script type="text/javascript">
    $(document).ready(function(){
        $('#div2 :input').change(function(i){
            var str = $(this).text;
            $('#div1 li').eq(i).text(str);
        });
    });
</script>

这有什么问题?提前致谢

4

4 回答 4

6

传递给change()函数的参数不是索引。它是一个event对象。您需要自己获取索引,使用index().

还有,text()这里是不是方法不对,需要用到val()获取输入的值。

$('#div2 :input').change(function() {
    var str = $(this).val(), // You need to use `val` to get the value (also, note the "()" here)
        index = $(this).parent().index(); // this gets the index of the input
    $('#div1 li').eq(index).text(str);
});​

演示:http: //jsfiddle.net/skram/UJBCr/1/

于 2012-05-11T18:25:12.440 回答
2

使用val()(因为你是在文本输入之后)不是text()

 var str = $(this).val();
于 2012-05-11T18:17:00.213 回答
1

改变var str = $(this).text

作为

var str = this.value; //or $(this).val()

于 2012-05-11T18:16:39.830 回答
1

用这个:

 $('#div2 :input').change(function(e){
      var i = $('#div2 :input').index(this);
      $('#div1 li').eq(i).text( $(this).val() );
 });

演示

于 2012-05-11T18:28:02.633 回答