在 Google Chrome 中实现 Select 下拉问题

Question

我正在使用 WordPress 中的 Materialize 开发一个项目。

一切正常，但我们在 Google Chrome.

中尝试实施时遇到了运行问题

这是我的代码

    <div class="input-field col s12">
        <select>
            <option>Value 1</option>
            <option>Value 2</option>
            <option>Value 3</option>
            <option>Value 4</option>
            <option>Value 5</option>
       </select>
 </div>

这是jQuery代码

<script type="text/javascript">
    jQuery(document).ready(function ($) {
        $('select').material_select();
    });
</script>

当我运行我在 Google Chrome 中的项目时，在控制台中我遇到了这个问题

如果有人有这方面的信息就太好了。

谢谢！

Answer 1

你需要给你的 options 一个 value 属性。

尝试：

   <select>
        <option value="1">Value 1</option>
        <option value="2">Value 2</option>
        <option value="3">Value 3</option>
        <option value="4">Value 4</option>
        <option value="5">Value 5</option>
   </select>

Answer 2

您在代码中为 jquery（jQuery 和 $）使用了不同的标识符。我检查过这在 firefox 上工作正常但在 chrome 上出错，尝试将其更改为

$(document).ready(function ($) {
        $('select').material_select();
    });

不确定是否解决了问题，但正确的使用方法如上。

Answer 3

我遇到了同样的问题。它正在运行，然后停止了。这是我最终解决它的方法：

<select class="browser-default">
    <option>OPTION 1</option>
    <option>OPTION 2</option>
</select>

在 Google Chrome 中实现 Select 下拉问题

Materialize Select Drop down issue in Google Chrome

jquery

wordpress

google-chrome

html-select

materialize