Question

我想从列表中获取输入框的值。我可以使用这样的html工作..

<div id='numbs'>
    <input id='1'>enter value
    <input id='2'>enter value
</div>

但是如果输入在列表中，我就无法工作这是我的代码。谢谢你的帮助。我对此非常陌生，所以如果有任何逻辑被抬起来请告诉我。

var lastl = parseInt($("input:last").attr('id'));

$("input").live("click", function() {
    if (this.id == lastl && ($(this).prev('input').attr('value') > 0)) {
        lastl = lastl + 1;
        $('#numbs').append('<input id=' + (lastl) + '> enter value');
   }
});

jsfiddle

编辑：我希望能够以这种格式制作我的HTML

<ul id='numbs'>
    <li><input id='1'>enter value</li>
    <li><input id='2'>enter value</li>
</ul>

Answer 1

您似乎只是在点击列表中的最后一个时尝试添加新的<input>。

有几件事需要注意：

使用on代替live或delegate，如果您必须使用较旧的jQuery，则更喜欢delegate而不是live。
您可能希望使用焦点事件而不是点击事件。有些人知道如何使用键盘，有些人必须使用键盘;此外，焦点似乎更适合你的意图。
某些浏览器存在所有数字id属性的问题，因此最好不要使用它们。
您不需要知道上一个项目的id，您可以根据游戏中<input>元素的总数来确定下一个项目。

我会用这样的东西：

$('#numbs').on('focus', 'input', function() {
    var $inputs = $('#numbs').find('input');
    if($inputs.index(this) == $inputs.length - 1) {
        var input = '<input id="input-'
                  + $inputs.length
                  + '">';
        $('#numbs').append('<li>' + input + '</li>');
    }
});

您希望在点击<input>内的最后一个<ul>时采取行动，因此请使用index准确说明：

if($inputs.index(this) == $inputs.length - 1)

演示：http://jsfiddle.net/ambiguous/L2MDa/

Answer 2

这会有用吗？

var numbs = $('#numbs').on('focusin', 'input:text', function (e) {
    var lastInput = numbs.find('input:text:last')[0];

    if (this === lastInput) {
        numbs.append('<li><input /> enter value</li>');
    }
});

此外，我将您的事件从点击切换为焦点，因为有人可能只是在您的表单字段中进行制表。

Answer 3

您甚至无需输入编号即可完成此操作：

<div id='numbs'>
    <li><input>enter value</li>
    <li><input>enter value</li>
</div>

$("#numbs").on("focus", 'input', function() {
    var inputs = $('input');
    if (inputs.index(this) == inputs.length-1 && inputs.eq(inputs.length-2).val() > 0 ) {
        $('#numbs').append('<li><input>enter value</li>');
    }
});

示例：http://jsfiddle.net/jtbowden/k4gMJ/

以前的列表项作为输入

3 个答案: