1

これが非常に基本的な質問であることは承知していますが、私は JavaScript にまったく慣れていないので、必死です。この問題を解決する方法を調べましたが、わかりません。最初のタイトルまたは 2 番目のタイトル、またはその両方と名前を呼び出す必要があります。どうすればいいですか?ありがとう!!

<script type="text/javascript">
function ack(){
var name = document.forms[0].elements[0];
var nameValue = name.value;
var title1 = document.forms[0].elements[1];
var title1Value = title1.value;
var title2 = document.forms[0].elements[2];
var title2Value = title2.value;
alert("Thank you for ordering " +title1Value +title2Value +nameValue);
}
</script>

<form>
<h3>Now Available!</h3> <h4>Happy Traveling 2: More Layouts for the Travel Scrapbooker</h4><br/><br/>
<h3>Also available:</h3> <h4>Happy Traveling: Layouts for the Travel Scrapbooker</h4><br/><br/>
<h4>Order today!</h4><br/><br/>
<label>Name:</label>
<input type="text" id="name"/><br/><br/>
<input type="checkbox" id="title1" value="Happy Traveling"/>Happy Traveling<br/>
<input type="checkbox" id="title2" value="Happy Traveling 2"/>Happy Traveling 2<br/><br/>
<input type="submit" value="Submit" onclick="ack();"/>
</form>
4

2 に答える 2

0

いくつかの提案:
1document.getElementById("your id")ページ要素を取得するために使用します。より効率的で読みやすいです。したがって、コードを次のように変更する必要があります。

var name = document.getElementById("name");

2 title1 の値は、チェックされているかどうかに関係なく、常に "Happy Traveling" を返します。チェックされているかどうかを確認する必要があります。「checked」プロパティを使用できます。

var title1 = document.getElementById("title1");
var title1Value = "";
if(title1.checked){
    title1Value = title1.value;
}

3 フォームを送信する前に、名前が空かどうかを確認する必要があります。
4 javascript/html の詳細については、 w3schoolsで詳細を確認してください。
お役に立てば幸いです。

変更されたコード:

function ack(){
    var name = document.getElementById("name");
    var nameValue = name.value;
    var title1 = document.getElementById("title1");
    var title1Value = "";
    if(title1.checked){
        title1Value = title1.value;
    }
    var title2 = document.getElementById("title2");
    var title2Value = "";
    if(title2.checked){
        title2Value = title2.value;
    }
    alert("Thank you for ordering " +title1Value +title2Value +nameValue);
}
于 2012-11-01T02:41:18.993 に答える
0

いくつかのコメント:

フォーム コントロールが正常に動作するには名前が必要です。ID 属性はオプションであり、通常は不要であり、役に立ちません。フォーム コントロールは、name プロパティを使用して、フォームの名前付きプロパティとして使用できます。そのため、フォームのデフォルト プロパティ (「名前」や「送信」など) と競合するコントロール名を使用しないでください。

最後に、ユーザーはボタンをクリックする以外の方法でフォームを送信できるため、送信ボタンにクリック リスナーを配置しないでください。フォームの送信ハンドラーにリスナーを渡します。これは、ack関数が必要に応じて を返すことで送信をキャンセルできることも意味しますfalse

検討:

<form id="orderForm" onsubmit="return ack();"> 
  <input type="text" name="personName"><br>
  <input type="checkbox" name="title1" value="Happy Traveling">Happy Traveling<br>
  <input type="checkbox" name="title2" value="Happy Traveling 2">Happy Traveling 2<br>
  <input type="submit" value="Submit">
</form>

<script type="text/javascript">

function ack() {
  var form = document.forms[0]; // or use getElementById
  var name = form.personName.value;
  var title1 = form.title1.checked? form.title1.value : '';
  var title2 = form.title2.checked? form.title2.value : '';

  alert('Thank you ' + name + ' for ordering:\n\n' + title1 + '\n' + title2);
}

</script>
于 2012-11-01T05:03:28.607 に答える