无法使用jquery更新/刷新选择选项

Question

我的HTML正文中有2个选择选项。 我正在尝试更新select选项，当select之前有一个更改。

但是，我在浏览器控制台中看到以下错误

未捕获的TypeError：undefined不是$（'＃plan'）的函数.selectmenu（“refresh”）;

HTML

    <select name="service" id="service" class="default" tabindex="3" onchange="updatePlanInfo(this)">
      <option value="" selected disabled>Service</option> <!-- Example of a hidden dropkick placeholder -->
      <option value="Hadoop">Hadoop</option>
      <option value="NoSQLDB">NOSQLDB</option>
    </select>

    <select name="plan" id="plan" class="default" tabindex="4" >
      <option value=""selected disabled>Plan</option>
      <option value="Free">Free</option>
      <option value="Small">Small</option>
    </select>

使用Javascript

    function updatePlanInfo(servicename)
    {
      alert(servicename);

var newOptions = {
  "Option 1": "value1",
  "Option 2": "value2",
  "Option 3": "value3"
};

var $el = $("#plan");
$el.empty(); // remove old options
$.each(newOptions, function(value,key) {
  $el.append($("<option></option>")
     .attr("value", value).text(key));
});

$('#plan').selectmenu("refresh");

    }

Answer 1

$（''）。selectmenu（）是一个jquery ui小部件。 您需要使用jquery ui js文件才能使用此小部件。

我希望这能帮到您。

Answer 2

这条线

$('#plan').selectmenu("refresh");

出于脚本错误有三个原因：

1. selectmenu方法是JQuery UI框架的一部分
2. 根据您在控制台中看到的错误，您似乎没有在页面中包含此框架。
3. 您必须先将select元素初始化为selectmenu然后才能refresh它。 喜欢： $("#plan").selectmenu();

这是一个有效的例子 。

但是，如果您不打算在项目中使用JQuery UI框架，则只需注释掉尝试刷新select元素的行。