Question

有一个带有method =“get”的html表单，没有动作＆amp;按钮类型=“提交”

    (function(){
        jQuery(".time").text(Date.now());
    })();
    jQuery(".set-hash").on("click", function () {
        location.hash = "hash";
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="get">
    <div class="time"></div>
    <input type="text" name="param">
    <button type="submit">Submit</button>
    <button type="button" class="set-hash">Set Hash</button>
</form>

案例1。

点击“提交”按钮。

查看请求已发送。

案例2。

点击设置哈希按钮
点击提交按钮

查看请求未发送。什么都没有改变。

案例3。

点击设置哈希按钮
将任何值设置为Param input
点击提交按钮
将任何其他值设置为Param input
点击提交按钮

请参阅仅在参数更改时发送请求。

所以问题是：为什么只有在参数更改时才会发送请求？

P上。 S上。

当从GET更改方法到POST时，一切正常。但我需要地址栏中的请求参数。

Answer 1

它在这里工作试试这个。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Doc title</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(function(){
        jQuery(".time").text(Date.now());
        var url = window.location.href;
        jQuery(".url").text(url);
        jQuery(".set-hash").on("click", function () {
                  location.hash = "hash";
                 // alert("test");
        });

});
</script>
</head>
<body>
<form method="get">
    <div class="time"></div>
    <input type="text" name="param">
    <button type="submit">Submit</button>
    <button type="button" class="set-hash">Set Hash</button><br />
    Current URL:<div class="url"></div>
</form> 
</body>
</html>

Answer 2

无法找到原因。

似乎麻烦与浏览器处理某些特殊方式的锚点有关。当我更改location.host浏览器尝试跳转到添加的锚点。而且这会影响提交按钮处理。

必须使用变通方法 - 从localStorage中的散列存储数据。

使用GET方法和location.hash值提交表单

2 个答案: