Question

为什么firefox（未在其他浏览器中测试）在地址栏中#;时加载表单值时出现问题？如果我有<input type='radio' checked="checked">，则地址栏中此元素的存在可能导致输入未实际检查（如预期）

我该如何避免这种行为？

示例代码：

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr" style="min-height:100%;">
    <head>
        <title>stuff2test</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    </head>
    <body class="popup" >
        <form action="" id="frm">
            <a href="#;" onClick="alert('added');">add #; to addressbar, and refresh</a>

            <?php $rnd = mt_rand(1, 4); ?>

            <label for="r_v1"> <input id="r_v1" type="radio" value="v1" <?php if($rnd==1){ echo 'checked="checked"';}?> name="r"></input> checked?</label>
            <label for="r_v2"> <input id="r_v2" type="radio" value="v2" <?php if($rnd==2){ echo 'checked="checked"';}?> name="r"></input> checked?</label>
            <label for="r_v3"> <input id="r_v3" type="radio" value="v3" <?php if($rnd==3){ echo 'checked="checked"';}?> name="r"></input> checked?</label>

        </form>

        <button onClick="getElementById('frm').submit();" type="button">submit</button>

        <br/>
        RND: <?php echo $rnd;?>
        <?php
        if($rnd>0 && $rnd<=3){
            echo "Checkbox {$rnd} should be checked";
        }
        ?>
        <br/>

        <?php
            var_dump($_GET);
        ?>
    </body>
</html>

Edit2：稍微清理一下代码，添加一个echo

Answer 1

你有这样的链接，对吧？

<a href="#">link</a>

你用JavaScript做了一些事情（这里也是jQuery），对吧？

$('a').click(function() {
    alert(1);
});

您需要在函数末尾添加return false。

$('a').click(function() {
    alert(1);

    return false;
});

修改

查看代码后...... NOT 使用内联JavaScript！

你需要一些能在点击上做某事的元素吗？只需添加类，ID - 您可以将其命名为......所以您可以区分元素然后......

$('a.my_class').click(function() { // $('a#my_id') // All you need to do. return false; // For preventing browser to add '#' after current link (if you have 'href="#"'). });

Answer 2

通过阅读有关问题的评论，答案似乎很清楚。

问题是Firefox在您重新加载页面时会尝试记住表单的状态，其中包括选中哪些复选框以及哪些复选框未选中。因此，即使您在重新加载时更改HTML中的默认值，Firefox也会将其视为相同的表单，并忽略HTML中设置的默认值，以支持在重新加载之前保存的内容。

我听说您可以通过提供HTTP标头Cache-Control: no-store或在表单元素上指定autocomplete="off"来禁用此行为。但我没有亲自测试过这两种解决方案。或者您可以使用Javascript在页面加载时重置表单（使用表单对象的reset()或通过显式设置每个字段的值）。

Answer 3

哈希（＃）是URL中的特殊字符。在它之后发送的任何内容都没有发送到服务器，所以如果你使用散列URL，你真的需要使用POST（或者如果GET是必要的话，对非散列URL的AJAX请求）来发送你的表单数据。

另一种方法是实施与Google _escaped_fragment_类似的内容，以确保将哈希值后的网址内容发送到服务器。

Answer 4

我大量使用“技巧”，并且没有问题，因为我使用input type =“submit”控件。

如果您更换该行：

<button onClick="getElementById('frm').submit();" type="button">submit</button>

与

<input type="submit" value="submit" />

在不更改锚点且不触及javascript代码的情况下解决问题。

祝你好运！

firefox有“＃;”在地址栏中

4 个答案: