Question

我的java脚本代码有问题。有些事情是错的，我不明白。我有以下代码，我无法提醒变量。

Javascript（内部标记）

＆＃13;

function read(){
  var city = document.getElementById("cd-dropdown").value;
  alert(city);
}

＆＃13;

这是身体标签

＆＃13;

<section class="main">
  <div class="fleft">
    <p>Choose City:</p>
  </div>
  <div class="fleft">
    <select id="cd-dropdown" class="cd-select">
      <option value="-1" selected>Choose City</option>
      <option value="Nicosia" >Nicosia</option>
      <option value="Larnaka" >Larnaka</option>
      <option value="Limassol" >Limassol</option>
      <option value="Paphos" >Paphos</option>
    </select>
  </div>
</section>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.dropdown.js"></script>
<script type="text/javascript">
  $( function() {
    $( '#cd-dropdown' ).dropdown( {
      gutter : 5,
      stack : false,
      delay : 100,
      slidingIn : 100
    } );
  });

</script>
......
<div class="cont_btn">
  <a onclick="read()" data-type="submit" class="btn">send</a>
</div>

＆＃13;

我选择了一个选项，但我无法提醒此选项。我不知道这里有什么问题。

Answer 1

你很亲密......试试下面的内容。在Jquery中，最好使用.on（）方法。你可以听听你想要的任何事件，然后回复它。

＆＃13;

$("#cd-dropdown").on("click", function() {
  alert($(this).val());
});

＆＃13;

<section class="main">
                <div class="fleft">
                    <p><br />Choose City:</p>
                </div>
                <div class="fleft">
                    <select id="cd-dropdown" class="cd-select">
                        <option value="-1" selected>Choose City</option>
                        <option value="Nicosia" >Nicosia</option>
                        <option value="Larnaka" >Larnaka</option>
                        <option value="Limassol" >Limassol</option>
                        <option value="Paphos" >Paphos</option>
                        
                    </select>
                </div>
            </section>
        
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
......

<div class="cont_btn">
    <a data-type="submit" class="btn">send</a>
</div>

＆＃13;

Answer 2

当我在a fiddle中重现错误时，直到我将jQuery的加载更改为No wrap - in <head>后才能生效。我认为你的问题可能是你在正文中加载jQuery，并且它是在你的其他脚本之后加载的，它会以某种方式抛弃它。尝试将其移至<head>标记，如下所示：

<head>
    <script>
        function read(){
            var city = document.getElementById("cd-dropdown").value;
            alert(city);
        }
        $( function() {
            $( '#cd-dropdown' ).dropdown( {
                  gutter : 5,
                  stack : false,
                  delay : 100,
                  slidingIn : 100
            } );
        });
    </script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="js/jquery.dropdown.js"></script>
    <!-- etc -->
    <title>Your Title</title>
</head>
<body>
        <section class="main">
                <div class="fleft">
                    <p></br>Choose City:</p>
                </div>
                <div class="fleft">
                    <select id="cd-dropdown" class="cd-select">
                        <option value="-1" selected>Choose City</option>
                        <option value="Nicosia" >Nicosia</option>
                        <option value="Larnaka" >Larnaka</option>
                        <option value="Limassol" >Limassol</option>
                        <option value="Paphos" >Paphos</option>
                    </select>
                </div>
            </section>
......

<div class="cont_btn">
    <a onclick="read()" href="#" data-type="submit" class="btn">Send</a>
</div>

Answer 3

您的代码应该工作，当您单击按钮时，复选框已经创建，请尝试下面的代码：

＆＃13;

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>Document</title>
    <script type="text/javascript">
        function read(){
            var city = document.getElementById("cd-dropdown").value;
            alert(city);
        }
    </script>
</head>
<body>
<section class="main">
    <div class="fleft">
        <p>Choose City:</p>
    </div>
    <div class="fleft">
        <select id="cd-dropdown" class="cd-select">
            <option value="-1" selected>Choose City</option>
            <option value="Nicosia" >Nicosia</option>
            <option value="Larnaka" >Larnaka</option>
            <option value="Limassol" >Limassol</option>
            <option value="Paphos" >Paphos</option>
        </select>
    </div>
</section>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.dropdown.js"></script>
<script type="text/javascript">
    $( function() {
        $( '#cd-dropdown' ).dropdown( {
            gutter : 5,
            stack : false,
            delay : 100,
            slidingIn : 100
        } );
    });

</script>

<div class="cont_btn">
    <a onclick="read()" data-type="submit" class="btn">send</a>
</div>
</body>
</html>

＆＃13;

Tested code on firefox

Javascript getElementById不选择元素

3 个答案: