0

我有一个有效的复选框提醒脚本： http: //mauricederegt.nl/test/index.html

它只是记住了复选框的状态，所以当你稍后回到网页时，它仍然会被选中到未选中。这一切都很好。

现在我需要在我的 HTML 页面中动态加载一个 php 页面（原始 php 页面从我的数据库中获取一些内容并显示一个名称列表。在该列表下方，出现此复选框，然后是来自 db 的另一个列表）。

我已将复选框放置在 php 文件中，但在加载 php 文件时它将显示在 HTML 文件中。js 文件仍然加载在 HTML 文件中（也尝试将其加载到 php 文件中，但这没有效果）。

问题：不再记得该复选框:(请参阅此演示： http: //mauricederegt.nl/test/index2.html

我认为这是因为页面现在是动态加载的并且在 HTML 中不可见？

我该如何解决这个问题，以便再次记住该复选框？

如果需要，请查看 js 代码的 HTML 文件的源代码（此处发布太多）

亲切的问候，

php代码：

   <?php  
$q=$_GET["q"];
$checked = ($_GET['checked'] == 1 ) ? 'checked="checked"' : '';

if ($q == 1) {
echo '<ul>
        <li>Mike</li>
        <li>Peter</li>
        <li>Richard</li>
        <li>Quintin</li>
        </ul>
<div id="soundcheck" class="button blue"><input type="checkbox" value="Name" id="sound" '.$checked.' /><label for="sound"></label></div>
<ul>
        <li>Apple</li>
        <li>Banana</li>
        <li>Pineapple</li>
        </ul>';
}
?>
4

2 回答 2

1

问题是检查然后设置复选框的记住状态的代码仅在页面首次加载（绑定到 DOM 就绪事件）时调用，因此在动态加载内容时不会调用。

调用现有代码的这一部分：

$('div#soundcheck input:checkbox').each(function() {
    // on load, set the value to what we read from storage:
    var val = storedData.get(this.id);
    if (val == 'checked') $(this).attr('checked', 'checked');
    if (val == 'not') $(this).removeAttr('checked');
    if (val) $(this).trigger('change');
});

动态加载复选框后，应该可以解决问题。

编辑：您需要将上述代码添加到现有 Javascript 的这一部分：

xmlhttp.onreadystatechange=function()
{
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        document.getElementById("scoreboard").innerHTML=xmlhttp.responseText;
        // add the above code here
    }
}
于 2012-05-22T10:31:12.617 回答
1

如果加载 GET 的 php，我假设它返回以下内容：

<php
echo <<<OUTPUT
<div id="soundcheck" class="button blue">
<input type="checkbox" value="Name" id="sound">
This is the checkbox, uncheck it and refresh the page. It should remain unchecked!
</div>
OUTPUT;

相反，让它返回：

为了让它更紧一点，我会选择：

<php
echo <<<OUTPUT
<div id="soundcheck" class="button blue">
<input type="checkbox" value="Name" id="sound">
<label for="sound">This is the checkbox, uncheck it and refresh the page. It should remain unchecked!</label>
</div>
OUTPUT;

无论他们提交了什么，这将始终返回一个空白复选框。

现在，如果问题是除非他们取消选中该框，否则它应该保持选中状态，请使用：

<php
$checked ($_GET['checked'] == 1 ) ? 'checked="checked" : '';
echo <<<OUTPUT
<div id="soundcheck" class="button blue">
<input type="checkbox" value="Name" id="sound" $checked>
<label for="sound">This is the checkbox, uncheck it and refresh the page. It should remain unchecked!</label>
</div>
OUTPUT;

在你的js中使用以下内容：

xmlhttp.open("GET","test.php?q="+str+"&checked=1",true);
于 2012-05-22T10:59:41.190 回答