首页 > 解决方案 > 单击按钮时是否可以跳过/忽略发送的特定选项值?

问题描述

单击按钮时是否可以跳过/忽略发送的特定选项值?

例如

当我选择 42 码和耐克鞋,然后点击发送按钮,这将带我到http://example.com?size=42&shoes=nike

当我选择 42 码和所有鞋子然后单击发送按钮时,我想value="all"从请求中跳过/忽略,所以它会将我带到http://example.com?size=42而不是http://example.com ?size=42&鞋=全部

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <form action="http://example.com" method="get">
            <p>
                <select name="size">
                    <option value="42">42</option>
                    <option value="43">43</option>
                </select>
            </p>
            <p>
                <select name="shoes">
                    <option value="all">All</option>
                    <option value="nike">nike</option>
                    <option value="addidas">addidas</option>
                </select>
            </p>
            <p>
                <input type="submit" value="Send">
            </p>
        </form>
    </body>
    </html>

如何做到这一点?

标签: javascriptphpjquery

解决方案


您可以,表单不会发送禁用的输入/选择字段。所以你应该在发送之前验证和禁用它,

检查片段,

片段不会显示 URL,要查看 URL,请使用网络选项卡将片段复制到本地

function checkMyForm(){

  var shoes = document.getElementById("shoes").value;
  
  if(shoes == "all"){
  
  document.getElementById("shoes").disabled  = true;
  
  }
  
  return true;

}
<form action="http://example.com" method="get" onsubmit="return checkMyForm()">
                <p>
                    <select name="size">
                        <option value="42">42</option>
                        <option value="43">43</option>
                    </select>
                </p>
                <p>
                    <select name="shoes" id="shoes">
                        <option value="all">All</option>
                        <option value="nike">nike</option>
                        <option value="addidas">addidas</option>
                    </select>
                </p>
                <p>
                    <input type="submit" value="Send">
                </p>
            </form>


推荐阅读