Question

请帮我将所选动态创建的radiobutton的值显示为div

继承我的代码......请告诉我我的代码中出了什么问题...谢谢

<script type="text/javascript">
    var div = $("#show_ans");
    $("input[type='radio']").click(function() {
        var radioVal = $(this).value;
        div.html("radioVal");
    });
</script>

html代码是

$i=0
$sql = mysql_query("SELECT * FROM `question_bank` where `test_name`='$tname' 
AND`posted_by`='$fac'");
if (mysql_num_rows($sql) > 0) 
 while($row2 = mysql_fetch_array($sql))
  {
   if($i<=$maxq){
       ....
       ....
        <table>
     <tr><td colspan=3><?php echo $row2['question'];?></td>
         <td><ul class="menu">
             <li><div id="show_ans" style="display:none"></div>
</li></ul>
         </td>
     </tr>
     <tr><td style="width:250px" align=left>
            <input id="r1" type="radio" name="<?php echo "s_option".$i;?>" value="<?php echo $row2['choice_a'];?>" ><?php echo $row2['choice_a'];?>
         </td>
         <td style="width:250px" align=left>
            <input id="r1" type="radio" name="<?php echo "s_option".$i;?>" value="<?php echo $row2['choice_b'];?>" ><?php echo $row2['choice_b'];?>
         </td>
         <td style="width:250px" align=left>
            <input id="r1" type="radio" name="<?php echo "s_option".$i;?>" value="<?php echo $row2['choice_c'];?>" ><?php echo $row2['choice_c'];?>
         </td>
         <td style="width:250px" align=left>
            <input id="r1" type="radio" name="<?php echo "s_option".$i;?>" value="<?php echo $row2['choice_d'];?>" ><?php echo $row2['choice_d'];?>
         </td>
     </tr>
    </table>
....
....

如果对单选按钮有任何咔嗒声，它应该在相应的div上产生值，并且对于所有循环重复应该重复它。请提前指导我。

Answer 1

尝试替换

div.Html("radioVal");

与

div.html(radioVal);

以及如果您可以将事件更改为更改（但仅限于其可选和建议）

$("input[type='radio']").click(function() {

并将您的脚本放在document.ready中

<script type="text/javascript">
    $(document).ready(function(){        
        var my_div = $("#show_ans");         //change div to my_div
        $("input[type='radio']").change(function() {
           var radioVal = $(this).val();     //This is not value it is val();
           my_div.html(radioVal);
        });
    });
</script>

Answer 2

您的正确代码是：

// html代码

<table>
    <tr>
        <td colspan=3>demo</td>
        <td>
            <ul class="menu">
                <li>
                    <div id="show_ans" style="display:none"></div>
                </li>
            </ul>
        </td>
    </tr>
    <tr>
        <td style="width:250px" align=left>
            <input id="r1" type="radio" name="k" value="5" />5</td>
        <td style="width:250px" align=left>
            <input id="r1" type="radio" name="k" value="6" />6</td>
        <td style="width:250px" align=left>
            <input id="r1" type="radio" name="k" value="7" />7</td>
        <td style="width:250px" align=left>
            <input id="r1" type="radio" name="k" value="8" />8</td>
    </tr>
</table>

// java脚本代码

$(document).ready(function () {
    var div = $("#show_ans");
    $("input[type='radio']").click(function () {
        var radioVal = $(this).val();
        div.html(radioVal);
    });
});

注意：

您正在使用'<div id="show_ans" style="display:none"></div>'然后告诉我如果div已经显示为none，您怎么看？如果您使用Firebug查看，则可以在“show_ans”div中看到您的无线电值。祝好运！！：）

Answer 3

更正

<强>替换

<li><div id="show_ans" style="display:none"></div>

要

<li><div class="show_ans" style="display:none"></div>

和

<强>替换

var div = $("#show_ans"); $("input[type='radio']").click(function() { var radioVal = $(this).value; div.Html("radioVal");

以

var div = $(".show_ans"); $("input[type='radio']").click(function() { var radioVal = $(this).value; div.html(radioVal);

以上更改是因为您在while循环中重复自我，其中多个dom具有相同的ID并且不允许。因此转换DIV id到class并看到jQuery代码更新。

另外，请务必添加.show()以移除div display:none;内嵌css，以便在click事件触发时用户可以看到它。

示例

div.show();

评论答案

$("input[type='radio']").click(function() { var div = $(this).closest('table').find(".show_ans"); var radioVal = $(this).val(); div.html(radioVal).show(); });

我所做的选择距离parent table最近，其中我们find特定DOM show_ans div class然后replace html然后显示它。

如何使用jquery在div中显示所选动态创建的单选按钮的值

3 个答案: