Question

我正在构建一个克隆和追加选择菜单的表单。在每个克隆中都有一个jQuery下拉选择器，我创建了一个名为 unitClone 的函数，您可以在JavaScript代码的末尾看到它。

unitClone = function(input) {
    var id = $('#' + input + ' .unit_select').attr('id');
    var id = ('#' + id);
    //alert(id);
    dd = new Select($(id));
    var selected = $(id).closest('td').find('.ingredient_unit').val();
    if (selected != null) {
        var selected = $(id).find(".dropdown li a[data-id=" + selected + "]").html();
        $(id).find('span').text(selected);
    }
}

由于某些原因，代码无法正常工作，第一项不允许我点击并选择，第三项允许我选择，但所有下拉菜单都使用相同的值。

非常感谢任何帮助。

这是我的代码：

http://jsfiddle.net/tlaverdure/nKrvh/

Answer 1

我将js代码中的 on 方法更改为 live ，并且每件事都可以正常工作

Select.prototype = {
    initEvents: function() {
        var obj = this;
        obj.dd.live('click', function(event) {
            $(this).toggleClass('active');
            return false;
        });
        obj.opts.live('click', function() {
            var opt = $(this);
            obj.val = opt.text();
            obj.index = opt.index();
            var num = $(this).closest('td').find('.num');
            var numVal = $(this).closest('td').find('.num').val();
            if (numVal > 1) {
                obj.val = obj.val + 's'
            }
            obj.placeholder.text(obj.val);
            obj.opt_id = opt.find('a').data('id');
            $('.recipe_difficulty').val(obj.opt_id);
        });
    },
    getValue: function() {
        return this.val;
    },
    getIndex: function() {
        return this.index;
    }
}

Here是已编辑的代码。

祝你好运

Answer 2

找到了修复方法。 .live没有成功。

obj.dd.toggle(function() {
        selectArea = $(this).attr('id');
        $('#'+ selectArea).addClass('active');
        return false;
        },
        function(){
            selectArea = $(this).attr('id');
                $('#'+ selectArea).removeClass('active');
             return true;
    });

http://jsfiddle.net/tlaverdure/nKrvh/3/

我究竟做错了什么？我正在尝试克隆一些字段并使用一些函数

2 个答案: