结合两个下拉菜单来确定提交按钮 link

Question

我有两个下拉菜单。首先是选择你的位置。二是选择要上传的图片类型。（即选项 1 - 阿克伦，选项 2 - 天际线）。我在我的 DropBox 帐户中为这些选项（Akron、Skyline）设置了一个文件请求（DropBox 生成的上传 link）。如果他们选择（Akron、Houses），那将是一个不同的上传 link。同样，（克利夫兰，街道）将是另一个上传 link。使用 JQuery，我将 link 发送到我的提交按钮 HTML。无论我选择什么选项，我尝试过的所有内容都会发送到 link。（即，即使我选择（Akron，Houses），所有内容都会转到（Akron，Skyline）link。我的 if 语句中有问题，我无法弄清楚。这是我的代码示例。 if 语句用于 (Akron, Skyline) 组合。一旦我让这个选项工作，将为其他选项编写额外的代码。我已将上传 link 替换为通用 URL。

<!DOCTYPE html>
        <html>
        <body>
            <script src="https://code.jquery.com/jquery-3.1.1.js"></script>
            <p> Choose Your Location </p>
            <select id="Location Select">
                <option value="Choose Location">Choose Location</option>
                <option value="Akron">Akron</option>
                <option value="Alliance">Alliance</option>
                <option value="Ashland">Ashland</option>
                <option value="Barberton">Barberton</option>
                <option value="Bellaire">Bellaire</option>
            </select>
            <br>
            <br>
            <p> What Pictures or Videos are You Uploading? </p>
            <select id="Type Select">
                <option value="Choose Type">Choose Type</option>
                <option value="Skyline">Skyline</option>
                <option value="Streets">Streets</option>
                <option value="Houses">Houses</option>
            </select>
            <br>
            <br>
            <a href='URL'>
                <input type="button" value="Upload" />
                <script>
       if("#Location Select").val("Akron") && ("#Type  Select").val("Skyline"){
       $("a").attr("href",'https://www.google.com');
     }
     </script>
        </body>
        </html>

Answer 1

这个这个代码。它缺少 $ 以及括号。

if($("#Location Select").val("Akron") && $("#Type  Select").val("Skyline")){
       $("a").attr("href",'https://www.google.com');
     }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
        <html>
        <body>
            <script src="https://code.jquery.com/jquery-3.1.1.js"></script>
            <p> Choose Your Location </p>
            <select id="Location Select">
                <option value="Choose Location">Choose Location</option>
                <option value="Akron">Akron</option>
                <option value="Alliance">Alliance</option>
                <option value="Ashland">Ashland</option>
                <option value="Barberton">Barberton</option>
                <option value="Bellaire">Bellaire</option>
            </select>
            <br>
            <br>
            <p> What Pictures or Videos are You Uploading? </p>
            <select id="Type Select">
                <option value="Choose Type">Choose Type</option>
                <option value="Skyline">Skyline</option>
                <option value="Streets">Streets</option>
                <option value="Houses">Houses</option>
            </select>
            <br>
            <br>
            <a href='URL'>
                <input type="button" value="Upload" />

        </body>
        </html>

Answer 2

备注

http://api.jquery.com/val/

.val() 不接受任何参数。

另请注意，您首先必须识别所选元素，然后获取其值。

HTML ID 不应该有空格，并且在任何给定的文档中应该只有一个特定字符串的 ID。如果要描述 type 元素，请改用 class。例如：

<p> Choose Your Location </p>
<select class="Select" id="Location">
  <option value="Choose Location">Choose Location</option>
  <option value="Akron">Akron</option>
  <option value="Alliance">Alliance</option>
  <option value="Ashland">Ashland</option>
  <option value="Barberton">Barberton</option>
  <option value="Bellaire">Bellaire</option>
</select>
<br>
<br>
<p> What Pictures or Videos are You Uploading? </p>
<select class="Select" id="Type">
  <option value="Choose Type">Choose Type</option>
  <option value="Skyline">Skyline</option>
  <option value="Streets">Streets</option>
  <option value="Houses">Houses</option>
</select>
<br>
<br>
<a href='URL'>
  <input type="button" value="Upload" />

<script>
$('input').click((e) => {
  e.preventDefault();
  const location = $('#Location')[0];
  const type = $('#Type')[0];
  const locationVal = location.options[location.selectedIndex].value;
  const typeVal = type.options[type.selectedIndex].value;
  if (locationVal === 'Akron' && typeVal === 'Skyline') {
    console.log('Akron/Skyline');
  } else {
    console.log(`Other, ${locationVal} ${typeVal}`);
  }
});
</script>

（根据目前的代码，您实际上根本不需要 class="Select"）

结合两个下拉菜单来确定提交按钮 link

Combine two dropdown menus to determine submit button link

html

javascript

jquery

submit

dropdown