-1

我不明白为什么这不起作用？而不是删除小选项！

我有脚本：

<script>
var quantity_in_stock_s = 0


if ( quantity_in_stock_s === 0)
{

var S = document.getElementById("S");
document.getElementById("mySelect").removeChild(S);

}

</script>

和 HTML：

<form>
<select id="mySelect">
<option id="S">Small</option>
<option id="M">Medium</option>
<option id="L">Large</option>
</select>

</form>

这有错吗？！！： 

</head>
<body>


<form>
<select id="mySelect">
  <option id="S">Small</option>
  <option id="M">Medium</option>
  <option id="L">Large</option>
</select>

</form>
<script>

   var quantity_in_stock_S = 0
   var quantity_in_stock_M = 0
   var quantity_in_stock_L = 0

function deleteOption1(){
      if ( quantity_in_stock_S === 0)
   {
     var S = document.getElementById("S");
     document.getElementById("mySelect").removeChild(S);
   }

}

function deleteOption2(){
      if ( quantity_in_stock_M === 0)
   {
     var M = document.getElementById("M");
     document.getElementById("mySelect").removeChild(M);
   }

}

function deleteOption3(){
      if ( quantity_in_stock_L === 0)
   {
     var L = document.getElementById("L");
     document.getElementById("mySelect").removeChild(L);
   }

}


window.onload = deleteOption1;
window.onload = deleteOption2;
window.onload = deleteOption3;


</script>
4

4 回答 4

1

它应该是window.onload = deleteOption;而不是window.load = deleteOption;

于 2013-08-09T13:12:55.600 回答
1

如果事实上，这是一个修改后的脚本：

<form>
  <select id="mySelect">
    <option id="S">Small</option>
    <option id="M">Medium</option>
    <option id="L">Large</option>
  </select>
</form>
<script type="text/javascript">
  var quantity_in_stock_S = 0
  var quantity_in_stock_M = 0
  var quantity_in_stock_L = 0

  function deleteOptions() {
   if ( quantity_in_stock_S === 0) {
     var S = document.getElementById("S");
     document.getElementById("mySelect").removeChild(S);
   }
   if ( quantity_in_stock_M === 0) {
     var M = document.getElementById("M");
     document.getElementById("mySelect").removeChild(M);
   }
   if ( quantity_in_stock_L === 0) {
     var L = document.getElementById("L");
     document.getElementById("mySelect").removeChild(L);
   }
  }

  window.onload = function() {
    deleteOptions();
  };
</script>

或者......如果你想去Object Oriented：

  <form>
      <select id="mySelect">
        <option id="S">Small</option>
        <option id="M">Medium</option>
        <option id="L">Large</option>
      </select>
    </form>
    <script type="text/javascript">
      var Stocks = {
        SmallStock: 0,
        MediumStock: 0,
        LargeStock: 0,
        StockCheck: function() {
          if (Stocks.SmallStock === 0) {
            var S = document.getElementById("S");
            document.getElementById("mySelect").removeChild(S);
          }
          if (Stocks.MediumStock === 0) {
            var M = document.getElementById("M");
            document.getElementById("mySelect").removeChild(M);
          }
          if (Stocks.LargeStock === 0) {
            var L = document.getElementById("L");
            document.getElementById("mySelect").removeChild(L);
          }
        }
      };
      window.onload = function() {
        Stocks.StockCheck();
      };
    </script>
于 2013-08-09T13:45:57.137 回答
0

我认为您需要创建一个函数，然后在窗口加载或根据您的要求调用该函数：

function deleteOption(){
   var quantity_in_stock_s = 0
   if ( quantity_in_stock_s === 0)
   {
     var S = document.getElementById("S");
     document.getElementById("mySelect").removeChild(S);
   }
}

window.load = deleteOption;
于 2013-08-09T13:03:51.037 回答
0

如果您的代码不起作用，原因是您将其放在<head></head>标签之间，而没有将其绑定到窗口/文档加载事件 ( window.onload)。

尝试将相同的代码放在结束标记之前。</body>不要忘记把它放在<script></script>标签之间。

于 2013-08-09T13:06:55.093 回答