Question

所以我有这个奇怪的问题：

我有一个带有"Menu_DDL"类的选择元素。

我通过以下方式将其转换为jQuery UI .selectmenu()：

$(".Menu_DDL").selectmenu({
    width: "100%",
    change: function (event, ui) {
        event.preventDefault();
    }
});

现在我需要以编程方式更新值，但select的值不会改变：

var temp_email = $(this).attr("MID");
    console.log(temp_email);
    console.log("was: " + edit_email_template_dialog.find(".Menu_DDL").val());
edit_email_template_dialog.find(".Menu_DDL").val(temp_email);
    console.log("now: " + edit_email_template_dialog.find(".Menu_DDL").val());
edit_email_template_dialog.find(".Menu_DDL").selectmenu("refresh", true);
    console.log("refreshed");
edit_email_template_dialog.attr("TID", $(this).parents(".TR_Record").attr("TID"));
edit_email_template_dialog.dialog("open");

以上日志返回以下内容：

"49" 
"was: 23" 
"now: null" 
"refreshed"

如您所见，我尝试更新后，该值变为null。奇怪的是，如果通过控制台运行相同的代码，例如edit_email_template_dialog.find(".Menu_DDL").val("49");，它可以正常工作。

我错过了什么？

Answer 1

有时我必须设置选择菜单的值，而我所知道的是，相应的选项可能具有我在值属性或.text()中查找的值。所以我循环遍历每个选项，检查值属性AND .text()，例如：

// assuming var myValue is the value we're looking for
$(".menu option").each(function(){
    if ( $(this).val() == myValue || $(this).text() == myValue ) {
        $(".menu").val( $(this).val() );
    }
});

您还可以将所有内容设为小写，删除空格等，并打印调试说明：

// assuming var myValue is the value we're looking for
myValue = myValue.toLowerCase().replace( / /g, "" );
var currentValue;
var currentText;
$(".menu option").each(function(){
    currentValue = $(this).val().toLowerCase().replace( / /g, "" );
    currentText = $(this).text().toLowerCase().replace( / /g, "" );
    console.log("checking if '" + currentValue + "' == '" + myValue + "' OR if '" + currentText + "' == '" + myValue + "'");
    if ( currentValue == myValue || currentText == myValue ) {
        console.log(" ... match found, setting value");
        $(".menu").val( $(this).val() );
    }
});

调试笔记对我也很有帮助。每隔一段时间我就会发现一个我认为没有找到匹配的情况，但事实证明它是（＃34; ...匹配找到＃34;通知被打印出来）。这帮助我弄清楚稍后在同一个脚本中的某些代码重置了菜单的值。

使用jQuery </select>更新后，<select>值变为null

1 个答案: