Question

我写了一些HTML如下：

echo substr("this is a story of a man who was live in LA", 10,14);

我想打开一个对话框并为选择框应用<div id = "dialog-1" title = "Dialog Title goes here..."> <select id= "lang" name= "lang"> <option value="1"> TEXT </option> <option value="2"> HTML </option> </select> </div>事件以对选定值执行操作。

我打开对话框如下：

onChange()

现在我想在选择框上执行On change（）事件。我已经尝试过但是它不起作用：

$("#dialog-1").dialog({width: 600,height:500});

Answer 1

你的jQuery没有什么改变。您需要在.change()元素上分配<select>回调。如果您愿意，可以选择更具体。

$(function() {
  $("#dialog-1").dialog({
    width: 600,
    height: 500
  });
  $("#dialog-1 #lang").change(function(e) {
    var lang = $(this).find("option:selected").val();
    console.log("lang :: " + lang);
    $(this).parent().dialog("close");
  });
  $("a[rel='dialog']").button().click(function(e) {
    e.preventDefault();
    $($(this).attr("href")).dialog("open");
  });
});

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<a href="#dialog-1" rel="dialog">Open Language Selection</a>
<div id="dialog-1" title="Select Language">
  <select id="lang" name="lang">
        <option value="1"> TEXT </option>
        <option value="2"> HTML </option>
    </select>
</div>

正如您所看到的，这都是关于使用正确的选择器和正确的回调函数。

如果动态创建元素，则可以使用.on()函数。

$("#dialog-1").on("change", "select", function(){});

希望有所帮助。

如何在对话框内的选择框上应用更改事件

1 个答案: