Question

我有以下下拉菜单如何通过点击每个菜单将每个菜单重定向到相应的页面？有可能通过使用一个JavaScript函数，如果是的如何？提前谢谢......

<div>
 <ul>
  <li id=home onclick="show(this.id)"><a href="home.jsp">Home</a></li>
  <li id=collection onclick="show(this.id)><a href="collection.jsp">Collection</a></li>
     <ul>
       <li id=men onclick="show(this.id)><a href="men.jsp">Men</a></li>
       <li id=women onclick="show(this.id)><a href="women.jsp">Women</a></li>
     </ul>
  <li id=contact onclick="show(this.id)><a href="contact.jsp">Contact</a></li>
</ul>
</div>

Answer 1

是的，你可以。

在案例网址中使用window.open("URL")为this.id

您也可以更新window.location

在此处阅读更多内容http://www.tizag.com/javascriptT/javascriptredirect.php

像Niko说你需要收尾报价

.. onclick="window.open(this.id)" ..

Answer 2

试试这个？

$("div > ul li a").click(function() {
    window.location.href += "/" + $(this).parent()[0].id;
});

我尝试使用没有修改HTML的选择器，这就是为什么它看起来很icky。

Answer 3

如果您只需要基于参数重定向的JS函数，在您的情况下，该参数是组件ID，这将完成工作：

<script type="text/javascript">
    var show = function(id) {
        window.location.href = id + '.jsp';
    };
</script>

如果您想导航DOM并获取链接的href属性，请使用：

document.getElementById(id).firstChild.href

考虑ID引用的组件内的第一个元素是链接标记。

Answer 4

这没有任何意义。

我了解您的特定功能要求是在最终用户点击链接的<li> 空间中的某个位置时调用该链接。要实现这一点，只需将display元素的CSS <a>属性设置为block即可。这样，链接将跨越其父元素的整个空间。

<ul id="menu"> <li><a href="home.jsp">Home</a></li> <li><a href="collection.jsp">Collection</a></li> <ul> <li><a href="men.jsp">Men</a></li> <li><a href="women.jsp">Women</a></li> </ul> <li><a href="contact.jsp">Contact</a></li> </ul>

使用此CSS

#menu li a { display: block; }

不需要丑陋的JavaScript黑客攻击。在window.location = 'some.jsp';执行的操作是在当前窗口中打开一个新的JSP页面位置。但是，如果您针对具体问题使用正确的解决方案，则没有必要这样做。在未来的问题中，尝试详细说明功能需求，而不是只关注您认为它是特定功能需求的正确解决方案的解决方案。

如何用JavaScript打开一个新的jsp页面

4 个答案: