Jquery在事件触发器上传递并存储动态变量

时间:2012-07-24 23:30:23

标签: jquery events variables dynamic

输入文本框旁边有一个复选框。如果选中该复选框,则清空并禁用文本框。但是,我想将之前的值存储在该文本框中,以便在用户决定取消选中该复选框时将其返回到文本框。这是我的代码:

function disablePath() {
    var currentPath;
    $('#user_strategy').on('change','input[value="all"]', function(){
        var that = $(this);
        if($(this).is(':checked')) {
            currentPath = that.next().val();
            that.next().attr("disabled", "disabled").val('');
        }
        else {
            that.next().removeAttr("disabled").val(currentPath);
        }
    });
}

如果我只有一个复选框后跟一个文本框,那么效果非常好。如果我有多个复选框 - 文本框组合,我会遇到麻烦。如果我检查多个复选框,则只存储最后一个文本框内容 - 因此,如果我取消选中之前选中的任何一个框,则相应的文本框将填充最后一个相关复选框的文本框的值,无论关系如何。有没有办法存储特定于上一个复选框的文本框的值?这是实时代码:

http://kaboukie.net/stackoverflow/

我相信我需要使用eventData,但不确定如何,任何帮助将不胜感激!

3 个答案:

答案 0 :(得分:2)

我建议将数据附加到元素本身,这可以使用Jquery的.data()方法完成。

以下是我已经测试过正常工作的代码;)

$(function() {
    function disablePath() {
        var currentPath;
        $('#user_strategy').on('change','input[value="all"]', function(){
            var that = $(this);
            if($(this).is(':checked')) {
                temp= that.next().val();
                that.data("currentPath" , temp);
                that.next().attr("disabled", "disabled").val('');
            }
            else {
                that.next().removeAttr("disabled").val(that.data("currentPath"));
            }
        });
    }
    disablePath();
}); 

答案 1 :(得分:0)

如何将数据作为属性存储在复选框上?

$(function() {
    function disablePath() {
        var currentPath;
        $('#user_strategy').on('change','input[value="all"]', function(){
            var that = $(this);
            if($(this).is(':checked')) {
                $(this).attr("x:savedData", that.next().val());
                that.next().attr("disabled", "disabled").val('');
            }
            else {
               that.next().removeAttr("disabled").val($(this).attr("x:savedData"));
            }
        });
    }
    disablePath();
});

http://jsfiddle.net/ruwJT/

可能不是最佳做法,但它有效。

答案 2 :(得分:0)

问题是当你设置currentPath时,它不记得哪个元素负责。

要解决此问题,您可以为每个复选框指定唯一的ID属性,并将该ID作为键存储,并将文本框的值存储在键值对中。

或者,可以使用jQuery的.data()方法在任何元素上存储abritraty数据。见http://jsfiddle.net/EP5bg/