0

私は次のようなコードでチェックボックスフォームを検証していました:

<div>
  <form action="survey.php" method="post" name="survey"> 
  <span class="form"><input type="checkbox" name="event1" onClick="return countMarketing()">Event1</span>
  <span class"form"><input type="checkbox" name="event2" onClick="return countMarketing()">Event2</span>
  <span class"form"><input type="checkbox" name="event3" onClick="return countMarketing()">Event2</span>
  <!-- other forms -->
  </form>
</div>

そして、次のような JavaScript 検証 (チェックされたチェックボックスの数を制限するため):

function countMarketing() {

        var NewCountMarketing = 0

        if (document.survey.event1.checked)
        {NewCountMarketing = NewCountMarketing + 1}

        if (document.survey.event2.checked)
        {NewCountMarketing = NewCountMarketing + 1}

        if (document.survey.event3.checked)
        {NewCountMarketing = NewCountMarketing + 1}
        if (NewCountMarketing == 3)
        {
            alert('Please choose only two')
            document.survey; return false;
        }
    }

そして、このような検証が機能します。しかし、今、提出のためにphpを使用しているとしましょう。JSでフォームの名前が次のようなものであるかどうかを確認するにはどうすればよいですか。

 <input type="checkbox" name="events[]" id="event1" onClick="return countMarketing()">Event1

JSを次のように変更しようとしました：

if (document.survey.events[].checked)
    {code here}

if (document.survey.getElementByName('events[]').checked)
    {code here}

if (document.survey.getElementById('event1').checked)
    {code here}

しかし、それはうまくいきません..これについて私に光を当てることができる人はいますか? どうもありがとうございます ：）

4

2 に答える 2

1

実際にjQueryを使用している場合は、次のことができます。

この関数を使用する前に、ドキュメントに jQuery が含まれていることと、関数を実行する前にドキュメントが読み込まれていることを確認してください。

function countMarketing() {

  if( $('input[name="events[]"]').filter(':checked').length > 2 ) {
    alert('Please choose only two');
  }

}
于 2013-06-22T22:35:05.250 に答える
1

最初に を削除し、またはinline events declarationに移動します。external Javascript filescript block

bracket Notationそのような属性にアクセスするためにいつでも使用できます

document.survey["events[]"]

コード

    var elems = document.survey,
    checkboxNames = ["event1[]", "event2[]", "event3[]"];

for (var i = 0; i < checkboxNames.length; i++) {
    bindClick(elems[checkboxNames[i]]);
}

function bindClick(elem) {
    elem.addEventListener('click', countMarketing);
}

function countMarketing() {

    var NewCountMarketing = 0
    var latest;
    for (var i = 0; i < checkboxNames.length; i++) {
        if (elems[checkboxNames[i]].checked) {
            latest = elems[checkboxNames[i]];
            NewCountMarketing++;
        }
    }

    if (NewCountMarketing == 3) {
        latest.checked = false;               
        alert('Please choose only two')
        document.survey;
        return false;
    }
}

フィドルをチェック

于 2013-06-22T22:46:00.373 に答える