Question

我正在使用jquery chosen，其中包含特定组件multiple select。

我想听一下如果在所选文本栏中输入内容并提醒输入的内容。

要实现我的目标：

HTML：

<select id="searchZip" name="types[]" multiple class="searchZip chosen-select-no-results" tabindex="12">
</select>

JS：

<script type="text/javascript">
    var config = {
        '.chosen-select': {},
        '.chosen-select-deselect': {
            allow_single_deselect: true
        },
        '.chosen-select-no-single': {
            disable_search_threshold: 10
        },
        '.chosen-select-no-results': {
            no_results_text: 'Oops, nothing found!'
        },
        '.chosen-select-width': {
            width: "95%"
        }
    }
    for (var selector in config) {
        $(selector).chosen(config[selector]);
    }
</script>

如果在搜索框中输入内容，我想调用 alert（）。我怎么能这样做？

$("#searchZip").chosen().change( alert("a"); );

当我这样做时，我总是收到这个错误：

参数列表
之后的
Uncaught SyntaxError：missing）

如何使用所选输入中输入的输入调用警报？

Answer 1

在警告框内，不应该有任何分号，因为它会终止语句..

只需撰写.change(alert("a"));

Answer 2

您需要更改以下行：

$("#searchZip").chosen().change( alert("a"); );

对此：

$("#searchZip").chosen().change( alert("a") );

当JavaScript看到;时，它会认为它是该行的结尾。由于您的;位于.change()之内，因此JavaScript没有看到)的结束.change()，因此产生了以下错误，指出它是missing ) after argument list < / p>

Uncaught SyntaxError: missing ) after argument list

Answer 3

传递给函数 .change（）的那一行应该是一个函数。 alert("a")是一个函数调用（语句）。该调用可以移动到lambda（匿名）函数中：

$("#searchZip").chosen().change( function() {alert("a"); });

或者可以使用命名函数：

function alertA() {
    alert("a");
}
$("#searchZip").chosen().change( alertA );

有关详细信息，请参阅MDN documentation on functions as callbacks。

对于传递给 .change（）的参数，“documentation”有点缺乏，但更改调用.trigger()所以参数为：

活动：event

包含有关活动的信息
extraParam ：Object

包含有关所选选项的信息

extraParam可用于获取所选选项的文本：

function alertA(event, result) {
    alert(result.selected);
}

请参阅下面的演示。

$('.chosen-select-no-results').chosen({
  no_results_text: 'Oops, nothing found!'
});

function alertA(event, result) {
  alert(result.selected);
}
$("#searchZip").chosen().change(alertA);

<link href="https://harvesthq.github.io/chosen/chosen.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script src="https://harvesthq.github.io/chosen/chosen.jquery.js"></script>
<select id="searchZip" name="types[]" multiple class="searchZip chosen-select-no-results" tabindex="12">
<option>Cat</option>
<option>Dog</option>
<option>Zebra</option>
</select>

警告选择的jquery下拉列表中的文本选择

HTML：

JS：

3 个答案: