0

我这里有一个非常讨厌的问题！

我<ul>在每个<li>. 在每个列表元素中都有一个单选按钮，我想将它们组合在一起以使它们在单击时切换。

问题是收音机无法连接！如果我单击其中两个，它们都会被选中！

这是代码：http: //jsfiddle.net/bakaburg1/Djq5q/1/

注意：这是 wordpress 自定义字段的代码。

非常感谢！

EDIT1：重要的是每个列表元素中的字段保持连接，以便在 PHP 端我得到这样的数据结构：

array (
  0 => 
  array (
    'answer' => 'answer1',
  ),
  1 => 
  array (
    'answer' => 'answer2',
  ),
  2 => 
  array (
    'is_right' => 'on',
    'answer' => 'answer3',
  ),
  3 => 
  array (
    'answer' => 'yiuyiuyiuj',
  ),
)

EDIT2：暂时我用一些jQuery修补了这个问题：

jQuery('.mm_ps_answers input:radio').click(function(){
 jQuery(this).parents('ul').find('input:radio').not(this).attr('checked', false)
})

虽然不确定最优雅的解决方案，但也可以随意评论（而不是回答）这个片段！

EDIT3：我通过为字段提供三个不同的名称解决了这个问题，然后将发布的数据合并到一个数组中，然后序列化并保存在数据库中。

<li>
    <a class="mm_ps_move button"><img src="http://localhost:8888/minimamedicamenta/wp-content/themes/minima/img/move.png"></a>
    <a class="mm_ps_delete_answer button">Delete Answer</a>
    <input type="radio" class="mm_ps_is_right" name="mm_ps_answers_is_right[]">
    <input type="text" name="mm_ps_answers_input[]" value="">
    <input type="hidden" name="mm_ps_answers_impressions[]">
    <span class="mm_ps_impressions">impressions: <span>0</span></span>
</li>

但是出现了另一个问题......虽然文本输入字段后端的POST数据是一个有序数组，每个字段都有一个值，也是空的，单选按钮只发送一个值，所以我不知道已经检查了 wich 列表元素中的 wich 收音机，对此有什么帮助吗？这是 POST 中三个输入的数据（值是随机字符串）：

[04-Aug-2012 17:18:45] Line  (in ):
array (
  0 => 'cvxcv',
  1 => 'vs',
  2 => '',
  3 => 's',
)
[04-Aug-2012 17:18:45] Line  (in ):
array (
  0 => 'on',
)
[04-Aug-2012 17:18:45] Line  (in ):
array (
  0 => '',
  1 => '',
  2 => '',
  3 => '',
)

EDIT4：我使用 javascript 修补了问题，该 javascript 为修改列表的每个操作（排序、添加、删除元素）上的单选按钮分配了一个增量数值。虽然不是很干净。

4

3 回答 3

2 
<ul class="mm_ps_answers manage_list ui-sortable">
<li>
    <input type="radio" name="SameName">
    <input type="text" name="mm_ps_answers[0][answer]" value="jkjhk">
    <span class="mm_ps_impressions">impressions: </span>
</li>
<li>
    <input type="radio" name="SameName">
    <input type="text" name="mm_ps_answers[1][answer]" value="lknjlk">
    <span class="mm_ps_impressions">impressions: </span>
</li>
<li>
    <input type="radio" name="SameName">
    <input type="text" name="mm_ps_answers[2][answer]" value="òklkjl">
    <span class="mm_ps_impressions">impressions: </span>
</li>
<li>
    <input type="radio" name="SameName">
    <input type="text" name="mm_ps_answers[3][answer]" value="p09i0i">
    <span class="mm_ps_impressions">impressions: </span>
</li>

使浏览器切换它们的属性是RadioButton 的名称。将所有这些单选按钮命名为相同（每个组应具有相同的名称），它们将切换。

于 2012-08-02T12:45:35.467 回答
1

要将单选按钮组合在一起，您必须在 name 属性中指定相同的值。

前任。（来自 W3Schools）

<form action="">
<input type="radio" name="sex" value="male" /> Male<br />
<input type="radio" name="sex" value="female" /> Female
</form>

编辑： 为了保持您在提供的 jsFiddle 链接中计划的顺序，我建议您对一个列表项进行迭代声明：（对不起，错误的 php 代码，但我很长时间没有使用它）

foreach($answer as $value){
<li>
    <input type="radio" name="answer" value="$value[is_right]">
    <input type="text" name="$value[answer]" value="jkjhk">
    <span class="mm_ps_impressions">impressions: </span>
</li>
}
于 2012-08-02T12:48:35.377 回答
1

如果由于某种原因无法使用该name属性（例如，您的 name 属性是动态填充的 - 我怀疑是这样），您可以使用 jQuery 来切换复选框：

$(document).ready(function() {
    $('input[type="radio"]').click(function() {
      $('input[type="radio"]').prop('checked', false);
      $(this).prop('checked', true);        
    });        
});
于 2012-08-02T12:57:50.930 回答