duanchongchu5177 2019-08-02 18:04 采纳率: 0%
浏览 125

Javascript addEventListener不适用于Chrome,但适用于Firefox

I think I am trying something very easy but it does not work on Chrome but on Firefox.

Depending on the value of my combo box order-type I want to show the field nameField. Therefore, I have a JavaScript file, which has a Listener on changes. When I change now a value in the combo box in Firefox the nameField appears and I get a console message. In Chrome I don’t get anything at all.

My PHP file looks like this:

                            <select name="order-type" id="order-type">
                                    <option selected="selected">Choose one</option>
                                    <?php
                                    $products = array("Value1", "Value2", "Value");

                                    foreach($products as $item){
                                    ?>
                                    <option value="<?php echo strtolower($item); ?>"><?php echo $item; ?></option>
                                    <?php
                                    }
                                    ?>
                            </select>
                        </p>
                        <div id="nameField" style="display: none;">
                            <label for="userName">User name *</label>
                            <input id="userName" name="userName" type="text" class="required" autocomplete="username">
                        </div>
…
<script src="js/script.js" defer></script>

Script.js:

    var form = $("#my-form");

form.validate({
    errorPlacement: function errorPlacement(error, element) { element.before(error); },
    rules: {
        confirm: {
            equalTo: "#password"
        }
    }
});
form.children("div").steps({
    headerTag: "h3",
    bodyTag: "section",
    transitionEffect: "slideLeft",
    onStepChanging: function (event, currentIndex, newIndex)
    {
        form.validate().settings.ignore = ":disabled,:hidden";
        return form.valid();
    },
    onFinishing: function (event, currentIndex)
    {
        form.validate().settings.ignore = ":disabled";
        return form.valid();
    },
    onFinished: function (event, currentIndex)
    {
        form.submit();
    }
});

var comField = document.getElementById("order-type");

comField.addEventListener("change", function(){

    console.log("Combox Box");
    console.log(comField.value);
  if(comField.value.toLowerCase() == ("Value1").toLowerCase()){
    console.log("Value1");
    document.getElementById("nameField").style.display = "block";
  } else {
    console.log("other");
    document.getElementById("nameField").style.display = "none";

  }
});

Any ideas?

Thanks

Stephan

  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥15 【提问】基于Invest的水源涵养
    • ¥20 微信网友居然可以通过vx号找到我绑的手机号
    • ¥15 spring后端vue前端
    • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
    • ¥15 解riccati方程组
    • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
    • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
    • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
    • ¥50 树莓派安卓APK系统签名
    • ¥65 汇编语言除法溢出问题