链接重定向到错误页面答案

【问题标题】：Links redirecting to wrong page链接重定向到错误页面
【发布时间】：2016-06-28 17:33:50
【问题描述】：

这是我的Blog

我在首页添加了多标签搜索。

但是当我从菜单中选择绿色和灰色标签并单击过滤器后，它会重定向到 example.com/search/?q=label:blue|label:black 页面

但想将绿色和灰色标签重定向到 label:green|label:gray

下面是代码

<!doctype html>


<div class="tabs-outer">
  <div class="tabs-cap-top cap-top">
    <div class="cap-left"></div>
    <div class="cap-right"></div>
  </div>
  <div class="fauxborder-left tabs-fauxborder-left">
    <div class="fauxborder-right tabs-fauxborder-right"></div>
    <div class="region-inner tabs-inner">
      <div class="tabs section" id="main">
        <div class="widget HTML" id="HTML3">
          <h2 class="title">Multi Label Search</h2>
          <div class="widget-content">
            <div id="multi-search">
              <select id="cmbColumn" name="cmbColumn">
                <option value="" />Columns
                <option value="green+" />green
                <option value="blue+" />blue
              </select>
              <select id="cmbSidebar" name="cmbSidebar">
                <option value="" />Sidebars
                <option value="Gray+" />Gray
                <option value="black+" />black

              </select>

              <input onclick=" getValue() " value="Filter" type="button" />
            </div>
          </div>
          <div class="clear"></div>
          <span class="widget-item-control">
                                <span class="item-control blog-admin">
                                    <a class="quickedit" href="https://www.blogger.com/rearrange?blogID=5988384389032442595&action=editWidget&sectionId=main" onclick=" return _WidgetManager._PopupConfig(document.getElementById(&quot;HTML3&quot;)); " target="configHTML3" title="Edit">
                                        <img alt="" src="http://img1.blogblog.com/img/icon18_wrench_allbkg.png" height="18" width="18" />
                                    </a>
                                </span>
          </span>
          <div class="clear"></div>
        </div>
      </div>
      <div class="tabs section" id="main"></div>
    </div>
  </div>
  <div class="tabs-cap-bottom cap-bottom">
    <div class="cap-left"></div>
    <div class="cap-right"></div>
  </div>
</div>
<script type="text/javascript">
  function getValue() {
    var
      valcmbColumn = document.getElementById("cmbColumn").value = "green";
    valcmbSidebar = document.getElementById("cmbSidebar").value = "|label:Gray";

    valOutput = (valcmbColumn + valcmbSidebar);
    window.open("/search/?q=label:" + valOutput, "_self");

    valcmbColumn = document.getElementById("cmbColumn").value = "blue";
    valcmbSidebar = document.getElementById("cmbSidebar").value = "|label:black";

    valOutput = (valcmbColumn + valcmbSidebar);
    window.open("/search/?q=label:" + valOutput, "_self");


  }




  function toggle_visibility(id) {
    var e = document.getElementById(id);
    if (e.style.display == "block") {
      e.style.display = "none";
    } else {
      e.style.display = "block";
    }
  }
</script>


</!doctype>

【问题讨论】：

document.getElementById("cmbColumn").value="blue"; 您确定要在此处为该元素赋值吗？
这是我正在处理的示例stackoverflow.com/questions/25406754/…
这很好，但无济于事。看起来您在不应该为输入分配值。
Mike 是对的，您的 getValue 函数看起来很可疑。我想知道您为什么要以这种方式分配价值？无论如何请记住，实际保留的值将是最后出现的语句
但是我在 w3schools 中看到有什么方法可以在 document.getelement 分配 value="blue"

标签： javascript jquery html css jquery-plugins

【解决方案1】：

试试这个。我认为这应该可以解决问题。我无法使用您提供的代码对其进行测试

   function getValue() {
     var valcmbColumn = document.getElementById("cmbColumn").value;
     var valcmbSidebar = document.getElementById("cmbSidebar").value;

    valOutput = "label:"+valcmbColumn+"|label:"+ valcmbSidebar;
    window.open("/search/?q=" + valOutput, "_self");
  }

让我知道它是否有效

【讨论】：

它像传说一样工作，但小问题，它适用于所有我想在未来包含更多标签的标签？
是的，当然会，因为它直接从您的选择框中检索值。我认为你必须在 codecademy 学习 javascript 和 jquery 的基础课程，它会对你有很大帮助。
谢谢，是的，我应该学习更多东西，再次感谢@geeksal，这对我有很大帮助

【解决方案2】：

试试这个：

    <!doctype html>
    
    
    <div class="tabs-outer">
        <div class="tabs-cap-top cap-top">
            <div class="cap-left"></div>
            <div class="cap-right"></div>
        </div>
        <div class="fauxborder-left tabs-fauxborder-left">
            <div class="fauxborder-right tabs-fauxborder-right"></div>
            <div class="region-inner tabs-inner">
                <div class="tabs section" id="main">
                    <div class="widget HTML" id="HTML3">
                        <h2 class="title">Multi Label Search</h2>
                        <div class="widget-content">
                            <div id="multi-search">
                                <select id="cmbColumn" name="cmbColumn">
                                    <option value="" />Columns
                                    <option value="green" />green
                                    <option value="blue" />blue
                                </select>
                                <select id="cmbSidebar" name="cmbSidebar">
                                    <option value="" />Sidebars
                                    <option value="gray" />Gray
                                    <option value="black" />black
                                    
                                </select>
                                
                                <input onclick=" getValue() " value="Filter" type="button" />
                            </div>
                        </div>
                        <div class="clear"></div>
                        <span class="widget-item-control">
                                <span class="item-control blog-admin">
                                    <a class="quickedit" href="https://www.blogger.com/rearrange?blogID=5988384389032442595&action=editWidget&sectionId=main" onclick=" return _WidgetManager._PopupConfig(document.getElementById(&quot;HTML3&quot;)); " target="configHTML3" title="Edit">
                                        <img alt="" src="http://img1.blogblog.com/img/icon18_wrench_allbkg.png" height="18" width="18" />
                                    </a>
                                </span>
                            </span>
                        <div class="clear"></div>
                    </div>
                </div>
                <div class="tabs section" id="main"></div>
            </div>
        </div>
        <div class="tabs-cap-bottom cap-bottom">
            <div class="cap-left"></div>
            <div class="cap-right"></div>
        </div>
    </div>
    <script type="text/javascript">
        function getValue() {
            valcmbColumn = document.getElementById("cmbColumn").value;
            valcmbSidebar = document.getElementById("cmbSidebar").value;          
            valOutput = (valcmbColumn +"|"+ valcmbSidebar);
    //window.open("/search/?q=label:" + valOutput, "_self");
    alert(valOutput);
     }
        function toggle_visibility(id) {
            var e = document.getElementById(id);
            if(e.style.display == "block") {
                e.style.display = "none";
            } else {
                e.style.display = "block";
            }
        }
    </script>

alert() 添加到显示输出。

【讨论】：