Question

我有一个Dropdownlist。我在该下拉列表中添加了包装类。此类在下拉列表后添加了span以显示所选文本。

<span class="select-wrapper">
<select name="MethodId" id="Status" class="product-select product-select-js">
<option value="">---Select---</option>
<option value="0">GET</option>
<option value="1">POST</option>
<option value="2">FTP</option>
</select>
<span class="holder">POST</span>
</span>

我想更改下拉列表中所选的文本键盘箭头键（向上，向下，向左，向右）按下事件。

但这可以在google chrome中使用，但不适用于firefox.And我发现这是因为dropdownlist的span包装器。

有人能解决这个问题吗？

Answer 1

所以要逐步解决这个问题，首先需要include jQuery on your page。

然后你可以使用jQuery add an event listener到你的drop down box。

然后在事件监听器中，您将需要get the value of the drop down box.。

然后你会想要set the value of your span.

然后你会得到像

这样的东西

    <!DOCTYPE html>

    <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script src="scripts/jquery-2.1.3.js"></script>
        <script>
            $(function() {
                $('#Status').on('change keyup', updateValue);
            });
            function updateValue() {
                $('.holder').text($(this).find(':selected').text());
            }
        </script>
    </head>
    <body>
        <span class="select-wrapper">
            <select name="MethodId" id="Status" class="product-select product-select-js">
                <option value="">---Select---</option>
                <option value="0">GET</option>
                <option value="1">POST</option>
                <option value="2">FTP</option>
            </select>
            <span class="holder"></span>
        </span>
    </body>
    </html>

下拉列表选择文本更改箭头键按下

1 个答案: