Question

我有一个动态创建的JQuery表单，我需要能够编辑并查找选项中的更改，但下面的代码只选取所选值，因为第二行代码设置了默认值，如下所示：已经选择了什么，但是在更改下拉列表时，无论我选择它，它始终保持原始值 - 我认为因为它已被第二行选中，我如何在更改选项文本时打破此限制（我有没有价值，只有文字）。

$('#msgBox4').html($('#msgBox4').html() + '<div class="table-row"><div class="table-col-l">Type:</div><div class="table-col-r"><select id="type2" required="required"><option selected value="" disabled> -- select an option -- </option><option>Holiday</option><option>Sick</option><option>Working Off Site</option></select></div></div>')
$("#type2 > option:contains('"+calEvent.description+"')").attr("selected", "selected");
Reason = $( "#type2 option:selected" ).text();

因此，变量Reason始终返回最初选择的结果，而不是我将其更改为。

Answer 1

此代码在消息框中显示所选的选项文本：

$("#msgBox4").on("change", "#type2", function() {
    alert($(this).val());
});

Here is the JSFiddle demo

Answer 2

在您尝试使用此代码之前，我想告诉您一些事情，请在您想要的任何内容中添加值。

$('document').ready(function(){
$('#msgBox4').html($('#msgBox4').html() + '<div class="table-row"><div class="table-col-l">Type:</div><div class="table-col-r"><select id="type2" required="required"><option selected value="" disabled> -- select an option -- </option><option value="Holiday">Holiday</option><option value="Sick">Sick</option><option value="Working Off Site">Working Off Site</option></select></div></div>');


$("#type2").on('change',function(){
var Reason = $("#type2").val();
alert(Reason);
 //and your other actions 
});

});

谢谢[＆＃39;}

Answer 3

找到一种更好的方法（因为我发现，如果下拉列表没有更改，则会导致Reason为undefined，因此在快速搜索后我发现了这一点，对其进行了调整它现在完美运行，只需检查dialog何时关闭并获取当前选项文本。

$( "#msgBox4" ).bind( "dialogclose", function(event, ui) {
    Reason = $('#type2').val();
});

JQuery - 选择不允许更改的选项

3 个答案: