5

我试图记住 jquery 选择中选定选项的决定。不幸的是,我无法以编程方式选择想要的选项。

以下是更多详细信息: HTML:

<div style="width: 140px">
<label for="select-choice-a" class="select">Lagerort: </label>
<select id="sel_stockIDs">
<option disabled="disabled">Lagerort</option>
</select>
</div>

JS(在 ajax 调用之后插入所有有效选项)。:

for (var j = 0; j < paramsParsed.length; j++) {
   // paramsParsed is {0001, 0002, 0003 etc.}
    loadedStocks[j] = '<option value=' + (j+1) + '>' +  paramsParsed[j] + '</option>';
    $("#sel_stockIDs").append(loadedStocks[j]);
}    

还为 select 设置了一个 Listener,用于存储用户决策 JS:

$('#sel_stockIDs').change(function() {
   sessionStorage.setItem("stockId", $('#sel_stockIDs option:selected').text());
});

外观”:

在此处输入图像描述

在用户选择了一个有效的“Lagerort”选项(stockId)之后,下一个 HTML 站点被打开。用户的决定(选项文本和选项值)保存在 localStorage 中。返回此页面时,做出的决定应该仍然是选定的选项。例如,用户选择 Lagerort “0001”,更改站点并返回 - 所选选项仍应为“0001”。因此,我再次加载股票(这很好用)

for (var j = 0; j < paramsParsed.length; j++) {
   // paramsParsed is {0001, 0002, 0003 etc.}
    loadedStocks[j] = '<option value=' + (j+1) + '>' +  paramsParsed[j] + '</option>';
    $("#sel_stockIDs").append(loadedStocks[j]);
}

现在我想再次设置选定的选项。但这不起作用....我尝试了许多不同的方法,并且在这个(我猜....)简单的问题上迷失了大约 2 天。到目前为止,这是我的方法(还没有任何效果)....为了更好的测试,想要的选项是硬编码的(值 = 1,文本 = 0001 = 两者都将链接到选择中的第一个选项)。

// Function is called, when user re-opens HTML-site 1
function reInsertData() {
    // setting the first option as selected
    // $('#sel_stockIDs option')[1].selected = true;
    // $('#sel_stockIDs option[value=1]')[0].selected = true;
    // $('#sel_stockIDs :nth-child(1)').attr('selected', 'selected');
    // $('#sel_stockIDs option').eq(1).attr('selected', 'selected');
    // $("#sel_stockIDs").val("1");
    // $("#sel_stockIDs").text("0001").attr('selected',true);
    // $("#sel_stockIDs").text("0001").attr('selected','selected');
    // $("#sel_stockIDs").text( "0001" ).prop('selected',true);
    // $("#sel_stockIDs").text( "1" ).prop('selected', selected);
    // $("select option").each(function(){
    //  if ($(this).text() == "0001")
    // This one finds the right option...... but doesn't select it
    //    $(this).attr("selected","selected");
    // });

 }

在 JSFiddle 中插入其中一些方法是可行的 - 但显示的代码在我的应用程序中都没有帮助。我使用的 JS 版本是 jQuery-mobile-1.3.0 和 jQuery-1.9.1.min。我将非常感谢任何帮助或一些提示!

4

3 回答 3

6

你的回答帮助我解决了这个问题.....所以,插入

$("#sel_stockIDs").val('1');

真的选择了想要的选项....(在这种情况下是第一个;见图:红色边框)但不幸的是,选择框没有注意到这种变化(见图:蓝色边框)。所以选择的文本仍然是“Lagerort”(这是某种占位符),而不是“0001”的想要(并且已经选择)值。

在此处输入图像描述

解决方案只是通过以下方式强制更改选择:

$('#sel_stockIDs').trigger('change');

此后,slect 的值也为“0001”。感谢您的帮助和最良好的祝愿!

于 2013-05-22T10:20:06.020 回答
5
$("#sel_stockIDs").val("1");

是正确的方法。

此外,您可能希望将value属性值用引号括起来:

loadedStocks[j] = '<option value="' + (j+1) + '">' +  paramsParsed[j] + '</option>';
于 2013-05-21T15:51:00.763 回答
1

尝试只点击 DOM 一次。例如,创建一个包含所有选项的字符串,然后附加它。还要注意引用的值(HTML 规范并不严格要求,但我会推荐它)

var myoptions = '';
var j = 0;
for (j = 0; j < paramsParsed.length; j++) {
    myoptions += '<option value="' + (j + 1) + '">' + paramsParsed[j] + '</option>';
}
$(myoptions).appendTo("#sel_stockIDs");

编辑:现在,确定要选择哪个选项,您需要在附加后执行此操作:

$("#sel_stockIDs").val('1');

可选地,您可以在选项创建期间设置选定的属性(if (j === 0)例如,添加选定的属性文本。

于 2013-05-21T16:04:30.653 回答