2012-02-22 4 views
2

私はJSでチュートリアル用のウェブサイトを作っています。私はそれについてミニテストを行っています。私は、ポップアップウィンドウに正しい答えと何を答えたのかをユーザーに伝える関数を追加する方法について、私はどう思っているのだろうか。私は既に正解をコード化していますが、私はポップアップボックスに答えたものを指定する関数をどのように作成するかと固執しています。ここでJavascript>返事を表示する

は、これまでの進捗状況です:

<html> 
<head> 
<title>Javascript Tutorials - Review 1</title> 
<script type="text/javascript"> 
function show_alert() 
{ 
alert("1. Correct Answer is: True"); 
alert("2. Correct Answer is: True"); 
alert("3. Correct Answer is: True"); 
} 
</script> 
<link rel="stylesheet" type="text/css" href="style.css" /> 
</head> 
<body> 
<div id="wrapper"> 
<div id="header"> 
<div id="logo"> 
<h1><a href="index.html">Javascript Tutorial</a></h1> 
</div> 
<div id="slogan"> 
<h2>Javascript Tutorial covering concepts</h2> 
</div> 
</div> 
<div id="menu"> 
<ul> 
<li class="first current_page_item"><a href="index.html">Home</a></li> 
<li><a href="struct.html">Structured Programming</a></li> 
<li><a href="sequence.html">Sequence Structure</a></li> 
<li><a href="comparison.html">Pseudocode, JS and Flowcharts</a></li> 
<li class="last"><a href="Workscited.html">Credits</a></li> 
</ul> 
<br class="clearfix" /> 
</div> 
<div id="splash"> 
<img class="pic" src="http://i.imgur.com/pCvZ4.png" width="870" height="230" alt="" /> 
</div> 
<div id="page"> 
<div id="content"> 
<div class="box"> 
<h2>Welcome to Javascript Tutorials 
<p> 
This is <strong>Javascript</strong>, quiz and test for the Three Control Structures. 
<p>Comparing Pseudocode, JavaScript and Flowcharts</p> 
<h3>Flowcharts can describe the same processes and information.</h3> 
<form name="threecont"> 
<input type="radio" name="option1contr" value="1"/>True<br /> 
<input type="radio" name="option1contr" value="2" />False.<br /> 
<p>Psuedocode and flowcharts are both tools to help you develop the logic for an algorithm?</p> 
<input type="radio" name="option2contr" value="4"/>True<br /> 
<input type="radio" name="option2contr" value="5" />False<br /> 
<p>IPO stands for Processing and output?</p> 
<input type="radio" name="option2contr" value="7."/>True<br /> 
<input type="radio" name="option2contr" value="8" />False<br /> 
<input type="button" onclick="show_alert()" value="Submit" /> 
</form> 
</div> 
<div class="box" id="content-box1"> 
<ul class="section-list"> 
</li> 
</ul> 
</div> 
<br class="clearfix" /> 
</div> 
<div id="sidebar"> 
<div class="box"> 
<h3>Navigation</h3> 
<ul class="list"> 
<li class="first"><a href="index.html">Home</a></li> 
<li><a href="struct.html">Structured Programming</a></li> 
<li><a href="sequence.html">Sequence Structure</a></li> 
<li><a href="comparison.html">Pseudocode, JS and Flowcharts</a></li> 
<li class="last"><a href="Workscited.html">Credits</a></li> 
</ul> 
</div> 
<div class="box"> 
<h3>Javascript Test Review</h3> 
<div class="date-list"> 
<ul class="list date-list"> 
<li class="first"><span class="date">2/21</span> <a href="review1.html">Review Structured Programming</a></li> 
<li class="first"><span class="date">2/21</span> <a href="review2.html">Review Sequence Structure</a></li> 
<li class="first"><span class="date">2/21</span> <a href="review3.html">Review Comparsion Quiz</a></li> 
</ul> 
</div> 
</div> 
</div> 
<br class="clearfix" /> 
</div> 
<div id="page-bottom"> 
<div id="page-bottom-content"> 
<h3>Javascript Tutorials</h3> 
<p> 
This website covers very basic Javascript chapters we've covered within class, the goal is to educate 
computer users on our content that we have covered so far. 
</p> 
</div> 
<div id="page-bottom-sidebar"> 
<h3>Links</h3> 
<ul class="list"> 
<li class="first"><a href="struct.html">Structured Programming</a> 
<li><a href="sequence.html">Sequence Structure</a></li> 
<li class="last"><a href="comparison.html">Pseudocode, JS and Flowcharts</a></li> 
</ul> 
</div> 
<br class="clearfix" /> 
</div> 
</div> 
</div> 
</body> 
</html> 

答えて

0

は「モーダルダイアログ」ではないポップアップを使用してください。これは本質的には、あなたがあなたのコンテンツを埋め込んで、クリックの位置(またはブラウザウィンドウの中央)に表示する、絶対配置されたDIVです。それはあなたがコンテンツ

  • 位置要素
  • 要素
  • は、Googleの "javascriptのモーダルダイアログ" たくさんある
  • クリックでそれを隠すロード隠さ

  • の始まり

    • 自分自身をロールしたくない場合は、これを行う事前に作られたプラグインを使用してください。

  • +0

    私はモーダルダイアログを使いたくないので、私はそれらを伝えるアラートを使用したいと思います。 – R3al2r3al

    +0

    あなたは、具体的に言うと、ユーザーにポップアップウィンドウが表示されるようにするための機能を追加するにはどうすればいいですか?これはアラートではありません。 –

    2

    さてさて、私anwserはそれについて移動するための最良の方法である場合ので、私は知りませんが、ここで、それはとにかく行く:初心者のためのまあ

    <p>Comparing Pseudocode, JavaScript and Flowcharts</p> 
    <h3>Flowcharts can describe the same processes and information.</h3> 
    <input type="radio" name="option1contr" value="1"/>True<br /> 
    <input type="radio" name="option1contr" value="2" />False<br /> 
    <p>Psuedocode and flowcharts are both tools to help you develop the logic for an algorithm?</p> 
    <input type="radio" name="option2contr" value="4"/>True<br /> 
    <input type="radio" name="option2contr" value="5" />False<br /> 
    <p>IPO stands for Processing and output?</p> 
    <input type="radio" name="option3contr" value="7"/>True<br /> 
    <input type="radio" name="option3contr" value="8" />False<br /> 
    <input type="button" onclick="show_alert()" value="Submit" /> 
    

    、あなたはラジオの名前(ものの名前を変更したい場合があります「IPOは処理と出力を表しますか?」)、最後の4つのうちの1つを選択することしかできないと考えています。また、「。一貫性のために最初のFalseの後に。 (も処分したoption3contrの値が7の後に「」)

    あなたができます

    function show_alert(){ 
    var thisArray =[document.threecont.option1contr, document.threecont.option2contr, document.threecont.option3contr]; 
    var answer1 = find_User_Answers(thisArray[0]); 
    var answer2 = find_User_Answers(thisArray[1]); 
    var answer3 = find_User_Answers(thisArray[2]); 
    
    alert(answer1 + answer2 + answer3); 
    
    } 
    
    function find_User_Answers(someVariable){ 
    
    var val = new Array(); 
    var thisRadio = someVariable; 
    
        for(var i = 0; i < thisRadio.length; i++){ 
    
        if(thisRadio[i].checked == true){ 
    
        if(thisRadio[i].value == "1" || thisRadio[i].value == "4" || thisRadio[i].value == "7"){ 
         val.push("true"); 
         } 
         else{val.push("false");} 
         } 
        }//end radiogroup for loop 
    
    return val; 
    } 
    

    今のところは、単一の行で答えを返すだろうが、彼らは順番にしています。それを分割する方法を今すぐもっと分かりやすく教えてください。

    alert("You Answered: " + answer1); 
    

    私はこれがあなたを助けてくれることを願っています!

    関連する問題