Question

如何为每个输入字段触发此ajax函数？目前它仅针对第一个字段触发，而没有其他页面没有刷新。

HTML：

<input id='item_name_1' value='item_name' onclick='test("1",  "item_name");'/>
<input id='item_value_2' value='item_value' onclick='test("2", "item_value");'/>

Jquery的：

   function test(id, field_name){

    $('#'+field_name+'_'+id).keyup(function(){
        $.ajax({
            type: "POST",
            url: "/admin/shop/update_harmonized_details",
            data:{
                id: id,
                field_name: field_name,
                field_value: $('#'+field_name+'_'+id).val()
            },
            success: function(resp){
                if(resp.msg == 'Success'){
                    alert('Value Updated');
                }
            }
        })
    });
}

Answer 1

<input id='item_name_1' value='item_name' class="listenToMe" />
<input id='item_value_2' value='item_value' class="listenToMe" />

 $('.listenToMe').keyup(function(){
     var value = $(this).val();
     var fieldID = $(this).attr('id').split('_');
     var id = fieldID[2];
     var name = fieldID[0] + '_' + fieldID[1];
     console.log('Value: value');
     console.log('ID:'+ id);
     console.log('Name:'+name);
 });

https://jsfiddle.net/vyeL9xu1/

如果您想避免解析id属性，可以使用data属性并使用$(selector).data('attributename')引用这些值。因此，您可以将data-fieldname添加到输入中，并使用$(this).data('fieldname')引用它。

此外，您似乎正在根据'keyup'更新数据。 AJAX调用是异步的，并且不一定会在您预期时到达，处理或完成。你可能会在这里遇到问题。如果有人输入“John”，它将按顺序发送到服务器，但o或h可以最后到达那里，然后它将无法正确保存。最好是提供一个保存按钮，或者仅在上一个完成后触发一个新事件，就像这样。

多次射击ajax

1 个答案: