1

我有选择 dom 和输入文本框的数组。在输入(特定索引)的模糊事件上,想要将元素设置为相同索引的选择 dom 值。

我的绑定正在工作,但是在不同输入框的每个模糊事件之后,它都会返回 0。

我无法根据给定索引设置选择值,即(下拉)

JSFiddle

我的代码如下。

$(document).ready(function (){
    var i =1;
    $('#addme').on('click', function(){

        var  test = '<tr class="employee"><td><input type="text" id="emp_id['+i+']" /></td><td><select id="emp_name['+i+']" '
        test += '<option value="-1" >Please Select </option><option value="e0001" >James Smith</option><option value="e0002" >Roger Sm</option>'  
        test +='<option value="e0003" >Elina Lobo</option></select></td></tr>'   
         
        $('#addme').after(test);
        i++;
    });

    $(".employee input").live('blur',function(){
        var inputIndex = $(this).index();
        var inputValue = $(this).val();
        alert("Input Index is :" +  inputIndex + ' and value is ' + inputValue);

        $('#emp_name[inputIndex]').each(function(){
            if(this.value == inputValue){
                $('#emp_name[inputIndex]').val($(this).val()); 
                    return false;
            }
            alert("Please iput valid value");
            $('#emp_name[inputIndex]').val('-1');
        });
    });
});
    </script>
    <table />
    <tr class="employee">
        <td><input class="employee" type="text" id="emp_id[0]" /></td>
        <td><select id="emp_name[0]" name="emp_name">
            <option value="-1" >Please Select </option>
            <option value="e0001" >James Smith</option>         
            <option value="e0002" >Roger Sm</option>
            <option value="e0003" >Elina Lobo</option>
        </select></td>
    </tr> 

    <input type="button" id="addme" value="ADD ME"/> 

  </body>
 </html> 
4

2 回答 2

1

当您在单击按钮时动态添加元素时,您需要委托事件。

所以$(".employee input").live('blur',function(){

应该看起来像这样

$(staticContainer).on('blur',".employee input", function(){

staticContainer是元素与元素绑定时已经在 DOM 中的元素。

容器越靠近性能越好。

您的代码也有多个问题..

最好将行附加到表中,以便选择器返回表内的正确元素。

$('#addme').after(test);

应该是

$('table').append(test);

接下来这个选择器不会替换索引值

$('#emp_name[inputIndex]')

应该是

$('#emp_name[' + inputIndex + ']')

最后,您访问索引的方式是完全错误的。

您正在尝试获取与其他元素相关的当前输入。所以

var inputIndex = $(this).index();

应该看起来像

var inputIndex = $('input').index(this);// 这将给出正确的值。

检查小提琴

于 2013-05-20T07:26:31.510 回答
0

首先,jQuery .Index() 表示查找 e 的所有兄弟的索引,而不是选择器字段的索引,如果你想这样做,你需要一个选择器参数。所以

var inputIndex = $(this).index();

应该改为

var inputIndex = $(this).index(".employee input");

那么您的索引部分将正常工作。

其次,我实际上不明白你的模糊事件代码部分。你说你想设置相同的select dom索引,为什么你比较值?你使用jQuery属性选择器,我没有看到任何匹配元素。我猜您尝试选择所有选定的 dom,并尝试在循环时发出警报?我认为这不是一个好主意。

我认为你应该重建这部分,它没有逻辑,现在很难阅读。

于 2013-05-20T07:57:38.743 回答