-3

大家好,我正在尝试运行多个 javascript。我的第一个 javascript 具有更改功能,但第二个不起作用。那么我怎样才能运行多个 javascript 代码呢?这是我的代码:

<html>
      <head>
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
            <script type="text/javascript">
              $(document).ready(function () {
                  $('#main').on('change', '.select-box', function () {

                      if ($(".select-box option[value='3']").attr('selected')) {
                          $('#demo').html("<select class='select-box'><option value='4'>a</option><option value='5'>b</option></select>");

                      }

                      if ($(this).val() == 5) {
                          document.getElementById("demo").innerHTML = "Woo";
                      }

                  });

              });
            </script>
            <script>
              var x = "", i;
              for (i = 0;i < 3;i++) {
                  x = x + "<option value='" + i + "'> " + i + "</option>";
              }
              document.getElementById("demo2").innerHTML = "<select>" + x + "</select>";
            </script>
      </head>
      <body>
            <div id="main">
                  <select class="select-box">
                        <option>Select an option</option>
                        <option value="1">no alert</option>
                        <option value="2">no alert too</option>
                        <option value="3">alert</option>
                  </select>
                  <p>
                        <br/>
                  </p>
                  <div id="demo"></div>
            </div>
            <p id="demo2"></p>
      </body>
</html>
4

2 回答 2

2

如果你想使用 jQuery 和其他一些 javascript 库,你可以尝试这样的事情

<script type="text/javascript" src="other_lib.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
  $.noConflict();
  jQuery(document).ready(function($) {
    // Code that uses jQuery's $ can follow here.
  });
  // Code that uses other library's $ can follow here.
</script>

在您的代码中,脚本标记中缺少额外的 type="text/javascript" 。所以它应该看起来像这样:

<script type="text/javascript">

var x="",i;
for(i=0;i<3;i++)
{
x=x + "<option value='"+i+"'> " + i + "</option>";
}
document.getElementById("demo2").innerHTML="<select>"+x+"</select>";
</script>
于 2012-09-10T14:42:59.240 回答
0

这个脚本:

<script>

var x="",i;
for(i=0;i<3;i++)
{
x=x + "<option value='"+i+"'> " + i + "</option>";
}
document.getElementById("demo2").innerHTML="<select>"+x+"</select>";
</script>

尝试在元素demo2存在之前获取它。将脚本移到之后的某个地方demo2,也许就在之前</body>

或者,或者,将最后一部分放在ready像您的第一个脚本一样的处理程序中:

<script>
var x="",i;
for(i=0;i<3;i++)
{
x=x + "<option value='"+i+"'> " + i + "</option>";
}

$(document).ready(function() {
    document.getElementById("demo2").innerHTML="<select>"+x+"</select>";
});
</script>

顺便说一句,这就是我的做法:

var demo2 = document.getElementById('demo2');

for(var i = 0; i < 3; i++) {
    var item = document.createElement('option');
    item.value = i;
    item.appendChild(document.createTextNode(i.toString()));
    demo.appendChild(item);
}
于 2012-09-10T14:36:14.717 回答