-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

実際には、ここに改訂されたスクリプトがあります:

<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 に答える
1

あるべきでありwindow.onload = deleteOption;、そうではないwindow.load = deleteOption;

于 2013-08-09T13:12:55.600 に答える
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 に答える