我有一个动态创建的列表，在它旁边显示单选按钮。当单选按钮更改时，我希望在动态创建的列表和已更改的单选按钮旁边显示一个下拉列表。基本上，如果我将按钮更改为是（可见），我希望在它旁边出现一个下拉列表......所以取决于我的列表中有多少项目以及哪些项目设置为是，将是设置位置的下拉列表（每个动态创建的下拉列表中有 8 个相同的固定选项）。
到目前为止，我想出的只是在 jquery 中创建一个 onchange 事件并“取消隐藏”一个预制的下拉列表 - 代码工作正常，但它不是所需要的。我将在下面发布代码和图片：
//K's function:
function get_all_pages() {
global $connection;
$query = "SELECT *
FROM pages ";
$query .= "WHERE visible = 1 ";
$query .= "ORDER BY position ASC";
$page_set = mysql_query($query, $connection);
confirm_query($page_set);
return $page_set;
}
//K's function:
function list_all_pages(){
$output = "<ul>";
$page_set = get_all_pages();
while ($page = mysql_fetch_array($page_set)) {
$output .= "<li><a href=\"add_feature.php?page=" . urlencode($page["id"]) . "\">{$page["menu_name"]}</a></li>";
$output .= " <input type=\"radio\" class=\"unchecked\" onclick=\"uncheck()\" name=\"visible_{$page["id"]} \" value=\"0\" checked=\"checked\" /> No <input type=\"radio\" class=\"checked\" onclick=\"check()\" name=\"visible_{$page["id"]} \"value=\"1\" /> Yes";
}
$output .= "</ul>";
return $output;
}
---------- jquery
<script type="text/javascript">
$(document).ready(function() {
//alert("document ready");
$('#position').hide();
});
$('.checked').change(function() {
$('#position').show();
});
$('.unchecked').change(function() {
$('#position').hide();
});
</script>
--------- html (not what is wanted but the only thing I've got going right now....
<form>
<?php echo list_all_pages(); ?>
<div id="position">
<select name="position">
var count;
for (count=1; count <= 8; count++) {
<option value='count'>count</option>;
}
</select>
</div>
</form>
截至 8 月 27 日的新信息 由于 rerazor11 在 jfiddle 中的帮助，它是半工作的...... php 循环中的 javascript onchange 正在工作，但仅适用于第一个<li>......事实上，当我点击其他<li>单选按钮时，下拉菜单有时会再次出现在第一个之下<li>...代码和新图片发布在下面：
//K's function:
function list_all_pages(){
$output = "<ul>";
$page_set = get_all_pages();
while ($page = mysql_fetch_array($page_set)) {
$output .= "<li><a href=\"add_feature.php?page=" . urlencode($page["id"]) . "\">{$page["menu_name"]}</a></li>";
$output .= " <input onchange=\"javascript:document.getElementById(1).style.display = 'block';\" type=\"radio\" name=\"visible_{$page["id"]} \" value=\"0\" checked=\"checked\" /> No <input onchange=\"javascript:document.getElementById(1).style.display = 'none';\" type=\"radio\" name=\"visible_{$page["id"]} \"value=\"1\" /> Yes";
$output .= "<div id='1' style='display: none'><select name='position'><option value='count'>1</option><option value='count'>2</option><option value='count'>3</option></select></div>";
}
$output .= "</ul>";
return $output;
}
9 月 2 日编辑：我尝试将 $counter 作为 ID，然后尝试使用 $page[id] 并且两者都返回了使 div 显示在每个 li 中的结果......但似乎有问题onclick javascript 正常工作...如果 redrazor11 或有人可以看一下，我将发布链接，也许可以找出 onclick 上发生的这种奇怪行为？关联：
http://www.firetreegraphics.com/widget_corp-final/add_feature.php
这是最近更改的代码：
//K's function:
function list_all_pages(){
$output = "<ul>";
//$output .= $counter = 0;
$page_set = get_all_pages();
while ($page = mysql_fetch_array($page_set)) {
$output .= "<li><a href=\"add_feature.php?page=" . urlencode($page["id"]) . "\">{$page["menu_name"]}</a></li>";
$output .= " <div id=\"$page[id]\" style='display: none'><select name='position'><option value='count'>1</option><option value='count'>2</option><option value='count'>3</option></select></div>";
$output .= " <input onchange=\"javascript:document.getElementById('$page[id]').style.display = 'block';\" type=\"radio\" name=\"visible_{$page["id"]} \" value=\"0\" checked=\"checked\" /> No <input onchange=\"javascript:document.getElementById('$page[id]').style.display = 'none';\" type=\"radio\" name=\"visible_{$page["id"]} \"value=\"1\" /> Yes";
//$output .= $counter = $counter+1;
}
$output .= "</ul>";
return $output;
}