1

1列に約6〜7<select>個のアイテムがあり<table>ます。ボタンをSubmit押すには、すべての<select>項目を選択する必要があります。では、Javascriptを使用してこれをどのように行うことができますか？

サンプルコードは次のようになります。

         <table>
 <tr>
    <td><select name="name1" style="width: 90px; height: 20px"> 
                            <option value = "--" >--</option>
                <option value = "10" >10</option>
         </select>
     </td>
    </tr>
<tr>
    <td><select name="name2" style="width: 90px; height: 20px">
                            <option value = "--" >--</option> 
                <option value = "20" >20</option>
                </select>
     </td>
    </tr>
<tr>
    <td><select name="name3" style="width: 90px; height: 20px"> 
                            <option value = "--" >--</option>
                <option value = "30" >30</option>
                </select>
    </td>
    </tr>
  </table>
4

3 に答える 3

0 
<table id="mytable">
  <tr>
    <td>
      <select name="name1" style="width: 90px; height: 20px">
        <option value = "--" >--</option>
        <option value = "10" >10</option>
      </select>
    </td>
  </tr>
  <tr>
    <td>
      <select name="name2" style="width: 90px; height: 20px">
        <option value = "--" >--</option>
        <option value = "20" >20</option>
     </select>
    </td>
  </tr>
  <tr>
    <td>
      <select name="name3" style="width: 90px; height: 20px">
        <option value = "--" >--</option>
        <option value = "30" >30</option>
      </select>
    </td>
  </tr>
</table>

<form action="" method="post" onsubmit="if(!check()) return false;">
  <input type="submit" />
</form>

<script type="text/javascript">
function check() {
  elements=document.getElementById("mytable").getElementsByTagName("select");
  for(i=0;i<elements.length;i++){
    if(elements[i].value == "--") { return false; }
  }
  return true;
}
</script>
于 2012-12-04T08:22:52.677 に答える
-1

1 つのオプションは、jQuery 検証プラグインを使用してから、すべての選択フィールドに「必須」を追加することです。

<form id="my_form">
    <select name="select1" class="required"> ... </select>
    <select name="select2" class="required"> ... </select>
    <select name="select3" class="required"> ... </select>
    ....
</form>

次に、JavaScriptは次のように簡単です-

$('#my_form').validate();

プラグインを使用するために必要なことは、ページ ヘッドに jQuery および jQuery 検証スクリプトを含めることだけです。

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script>
    ....
</head>

アップデート

明らかに、あなたの要件は非常に単純なものであり、このユースケースのためにサイトに完全な js ライブラリを追加することは間違いなくやり過ぎです。これが唯一の検証である場合は、純粋な js ソリューション (polin の回答など) をお勧めします。ただし、サイトに追加の検証要件がある可能性が高い場合は、jQuery 検証プラグインが非常に強力です。

于 2012-12-04T07:00:44.103 に答える
-1 
       var arr=new Array();
   status=true;
   function fnc()
   {
       elements=document.getElementById("atable").getElementsByTagName("option");
       for(i=0;i<elements.length;i++)
       {
           arr=elements[i].value;
           if(Number(arr)=='NaN')
            {
                status=false;
                break;
            }

           console.log(Number(arr));
    }
    if(status==true)
    document.getElementById("formname").submit();
    }

また、テーブルにIDを付けます

<table id="atable">
于 2012-12-04T07:06:41.830 に答える