Question

我在获取单选按钮的值时遇到了一些麻烦：http://testing.feministbitch.com/index.php/quiz_creator。我在底部有完整的代码。

当你点击添加问题时，我做了这个，以便人们可以选择以下单选按钮：true / false或多项选择。

我正在尝试这样做：根据他们选择是/否或多选，进一步的单选按钮或输入+下拉将在问题下面。但我失败了。请帮帮我:)。

这里的问题是我不知道将var x设置为等于获取true_false值或multiple_choice值。

我试过了，但这些都不起作用。

 //var x = $("#question_type"+count).value;
 //var x=document.forms["quizquiz"]["question_type" + count].value;

这是我的代码中的部分，根据他们选择的单选按钮附加真/假的东西或多个东西：

 if (x=="true_false"){
 $('#container').append(
 'The above statement is '+ '<Input id="true_or_false_' + count + '" type = "Radio" Name ="true_or_false[]" value= "true">' + 'True' + '&nbsp;&nbsp;&nbsp;&nbsp;'
 + '<Input id="true_or_false_' + count + '" type = "Radio" Name ="true_or_false[]" value= "false">'+ 'False<br /><br/>'
 );
 }else{
 $('#container').append(
        'A: ' + '<input id="multi_choices_' + count + '" name="multiple_choices[]' + '" type="text" maxlength="300" size="150"/><br />' +
        'B: ' + '<input id="multi_choices_' + count + '" name="multiple_choices[]' + '" type="text" maxlength="300" size="150"/><br />' +
        'C: ' + '<input id="multi_choices_' + count + '" name="multiple_choices[]' + '" type="text" maxlength="300" size="150"/><br />' +
        'D: ' + '<input id="multi_choices_' + count + '" name="multiple_choices[]' + '" type="text" maxlength="300" size="150"/><br />' + '<br />'
       +'Correct Choice: '
        +'<select name="correct_choice[]">'
        +'<option value="A">A</option>'
        +'<option value="B">B</option>'
        +'<option value="C">C</option>'
        +'<option value="D">D</option>'
        +'</select>'
        +'<br /><br />'
        );
 }

这是完整的代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

 <title>Quiz Creator</title>
 <script type="text/javascript" src="http://testing.feministbitch.com/js/jquery.js"></script>
<script type="text/javascript">
var count = 0;
$(function(){
 $('p#add_field').click(function(){
 count += 1;
 $('#container').append(
 '<strong>Question ' + count + '</strong><br />' 
 + 'Question text: ' + '<input id="question_field_' + count + '" name="question_fields[]' + '" type="text" maxlength="300" size="150"/><br />'
 + '<Input id="question_type_' + count + '" type = "Radio" Name ="questiontype_fields'+count+'[]" value= "true_false">' + 'True/False' + '&nbsp;&nbsp;&nbsp;&nbsp;'
 + '<Input id="question_type_' + count + '" type = "Radio" Name ="questiontype_fields'+count+'[]" value= "multiple_choice">'+ 'Multiple Choice<br /><br/>'

 );

 //var x = $("#question_type"+count).value;
 var x=document.forms["quizquiz"]["question_type" + count].value;

 var a=3;
 alert(a);
 if (x=="true_false"){
 $('#container').append(
 'The above statement is '+ '<Input id="true_or_false_' + count + '" type = "Radio" Name ="true_or_false[]" value= "true">' + 'True' + '&nbsp;&nbsp;&nbsp;&nbsp;'
 + '<Input id="true_or_false_' + count + '" type = "Radio" Name ="true_or_false[]" value= "false">'+ 'False<br /><br/>'
 );
 }else{
 $('#container').append(
        'A: ' + '<input id="multi_choices_' + count + '" name="multiple_choices[]' + '" type="text" maxlength="300" size="150"/><br />' +
        'B: ' + '<input id="multi_choices_' + count + '" name="multiple_choices[]' + '" type="text" maxlength="300" size="150"/><br />' +
        'C: ' + '<input id="multi_choices_' + count + '" name="multiple_choices[]' + '" type="text" maxlength="300" size="150"/><br />' +
        'D: ' + '<input id="multi_choices_' + count + '" name="multiple_choices[]' + '" type="text" maxlength="300" size="150"/><br />' + '<br />'
       +'Correct Choice: '
        +'<select name="correct_choice[]">'
        +'<option value="A">A</option>'
        +'<option value="B">B</option>'
        +'<option value="C">C</option>'
        +'<option value="D">D</option>'
        +'</select>'
        +'<br /><br />'


        );
 }


 });
});
</script> 



</head>



<body>



<div id="upload">
 <h1>Quiz Creator</h1>


    <?php

    $attributes = array('name' => 'quizquiz', 'id' => 'quizquiz');

    echo form_open_multipart('quiz_creator');
    //controller named quiz_creator

    ?>
    Quiz Name: <input id="quiz_name" name="quiz_name" type="text" maxlength="100" size="100"/><br /><br />
    <?php

//-------------------------------------------------study guide uploader
 for ($i = 1; $i <= 5; $i++) {   
 echo 'Study Guide '.$i.': '. form_upload('studyguide'.$i.'') . "<br />";
 }
//-------------------------------------------------study guide uploader

echo "<br />";

?>    


        <div id="container">
            <p id="add_field"><a href="#"><span>&raquo; Add a Question</span></a></p>
        </div>


    <br /><br />


<?php
echo "<br /><br />";
    echo form_submit('upload', 'Upload');
    echo form_close();
    ?>


</div>






</body>



</html>

Answer 1

HTML规范。声明元素的id属性必须是唯一的。仅使用name属性就足以将许多不同的选项组合在一起。此外，我不确定您采用该特定约定的原因，但id属性不需要以_字符结尾，也不需要name属性的值结束在[]中（我无法理解为什么你会想要它，因为它会降低可读性）。

要访问这些元素的值，请使用jQuery's .val() method。

对于单选按钮：

var value = $('input:radio[name="true_or_false[]"]:checked','#container').val();

对于选择元素：

var value = $('select[name="correct_choice[]"]','#container').val();

如何获取这些单选按钮的值？

1 个答案: