代码之家  ›  专栏  ›  技术社区  ›  Haim Evgi

仅从已更改的文本输入中收集值

  •  1
  • Haim Evgi  · 技术社区  · 14 年前

    我有一个html页面,在ajax调用后显示了很多数据行,在每一行我都输入了不同值的文本,用户可以编辑这个文本输入,然后按一个按钮来做一些计算操作。

    如何使用javascript(jQuery)只收集已更改的值,并将它们发送到php脚本。我寻找一个简单的方法,不是保存所有大数组的旧值然后与新值比较,有这样的解决方案吗?

    3 回复  |  直到 10 年前
        1
  •  6
  •   Yi Jiang G-Man    14 年前

    你可以使用 .data() 函数保留其原始值的副本,然后在提交时将其与值进行比较,以确保仅提交更改的值。

    var inputs = $('input[type="text"]').each(function() {
        $(this).data('original', this.value);
    });
    
    $('#form').submit(function(){
        inputs.each(function() {
            if ($(this).data('original') !== this.value) {
                // Do something for the changed value
            } else {
                // And something else for the rest.
            }
        });
    });
    

    请参见此处的演示: http://www.jsfiddle.net/yijiang/twCE9/

        2
  •  1
  •   Ankit Jaiswal    14 年前

    您可以使用输入字段的onChange事件并为此收集隐藏字段或全局数组字段中的信息。

        3
  •  1
  •   David    14 年前

    另一种方法是在每个编辑过的字段中添加一个“changed”类。然后,当他们提交表单时,您可以创建一个新表单,只更改类的那些元素,或者从包含所有文本输入的表单中删除其他元素。

    <input type="text" class="data_input" name="name1" value="value1" />
    <input type="text" class="data_input" name="name2" value="value2" />
    ...
    <input type="text" class="data_input" name="nameX" value="valueX" />
    

    然后在你的JS里

    $(document).ready(function() {
        $(".data_input").change(function() {
            $(this).addClass('changed');
        });
    

    或者如果您愿意使用全局数组:

    var changedArr = [];
    $(document).ready(function() {
        $(".data_input").change(function() {
            changedArr.push({'name': $(this).attr('name'), 'value': $(this).val()});
        });