2

为了选择类别,我想使用下拉列表。每个列表包含一个级别的类别。所以它是:顶级、子、子子、子子子等。每个级别都是通过我的脚本动态检索的getcat.php,它显示了一个<select>对象。

到目前为止,检索使用以下代码。但是,由于它是一个表单,我想获取最后一个选择的值,这样我就可以获得类别 ID。这对我不起作用。我试过$("select:last option:selected")了,但这不适用于新插入的元素。

选择类别后,必须显示一个输入字段,用户可以在其中创建自己的子类别(在所选类别内)。这也不适用于新元素。

现在,我尝试使用 .live ,但它不支持更改事件。各位大侠有什么改善方法的小窍门吗?

目前我有以下代码:

$("select").bind("change", function(){
    $(this).nextAll().remove();
    var value = $(this).val();
    $("#currentcat").val(value);
    if($("select:last option:selected").hasClass('makenew')) {
        $("#newcat").show();
    }
    else if($("select:last option:selected").hasClass('disabled')) { }
    else {
    $.get("getcat.php", { c: value },
        function(data){
            $("#getcats").append(data);
        });
    $("#newcat").hide();
    }    
});

然而,正如你所看到的,它不是一种美。

4

2 回答 2

2

您是否将 onchange 事件重新绑定到新的选择框?

于 2009-06-19T23:10:57.710 回答
1

如果您希望 new <option>s 绑定到 DOM 并跨不同的浏览器工作,我建议您使用 document.createElement 和 document.createTextNode 将它们附加到您的选择中,如下所示:

var opt = document.createElement('option');
opt.value = "someValue";
opt.appendChild(document.createTextNode("someText"));
$('#currentcat').append(opt);

因此,您可能应该使用$.getJSON而不是使用 $.get来获取一个 JSON 对象,该对象包含您将附加到您的选择的选项的值和文本属性。从服务器检索到的 JSON 对象应如下所示:

                { "options" : [   
                                    { "text" : "Fishing",  // First element
                                      "value"  : "5" },
                                    
                                    { "text" : "Skiing",  // Second Element
                                      "value"  : "70" }
                               ]
                }

迭代对象看起来像这样:

$.getJSON("getcat.php", { c: value }, function(json) {
    var $select = $('<select></select>).attr('id','currentcat').attr('name','currentcat').hide(); 
    $.each(json.options, function(i, item) {
        var opt = document.createElement('option');
        opt.value = item.value;
        opt.appendChild(document.createTextNode(item.text));
        $('#currentcat').append(opt);        
    });
    $("#newcat").hide();
    $('#someDiv').append($select).show();
}); 

以上内容未经测试,反映了我对您问题的理解。希望有帮助。

于 2009-06-19T23:26:57.567 回答