如何将选项标签链接到 html 中的其他页面？

How to link option tags to other pages in html?

提问by user3154388

am having difficulties in linking my pages. Have tried all the tricks I know(basic knowledge, because I just started learning web designing am actually a graphic designer and I only have the basic knowledge in html and css I have NO clue in js or php and the rest. just to let you know.) but nothing is working. hope you guess can help me. below are the codes..

我在链接我的页面时遇到困难。已经尝试了我知道的所有技巧（基础知识，因为我刚开始学习网页设计实际上是一个平面设计师，我只有 html 和 css 的基本知识，我对 js 或 php 一无所知，其余的。只是为了让你知道。）但没有任何效果。希望你猜可以帮助我。下面是代码..

    <div class="fleft">
        <ul id="cd-dropdown" class="cd-select">
            <option value="-1" selected>OUR SERVICES</option>
            <option class="icon-corporate">Corporate Branding</option>
            <option class="icon-logo">Logo Designing</option>
            <option class="icon-webdesign">Web Designing</option>
            <option class="icon-camera">Photography</option>
            <option class="icon-video">Video Editting</option>
            <option class="icon-art">Illustration</option>
            <option class="icon-work">Graphic Design</option>
        </ul>
    </div>

回答by Michael Garrison

First, are you trying to use a drop-down box or a list?

首先，您是尝试使用下拉框还是列表？

For a drop-down, as mentioned in this question, you can do the following with JavaScript. Use the onChangeevent to specify what to do when the value of the selection box is changed. Then use window.locationto tell the browser to navigate to a specific page.

对于下拉菜单，如本问题所述，您可以使用 JavaScript 执行以下操作。使用onChange事件指定在选择框的值更改时要做什么。然后用于window.location告诉浏览器导航到特定页面。

<select onChange="window.location.href=this.value">
    <option value="www.google.com">A</option>
    <option value="www.aol.com">B</option>
</select>

For a list, simply change your syntax a bit. Use a unordered list and then style it to your liking.

对于列表，只需稍微更改语法即可。使用无序列表，然后根据自己的喜好设置样式。

<ul>
    <li><a href="www.google.com"">A</a></li>
    <li><a href="www.aol.com">B</a></li>
</ul>

回答by Quentin

You can't link them per se.

你不能把它们本身联系起来。

If you want a list of links, then you should have an actual list of links:

如果你想要一个链接列表，那么你应该有一个实际的链接列表：

<ul>
    <li><a href="...">...</a></li>
    <li><a href="...">...</a></li>
</ul>

If you want to use a select menu then you should note that:

如果要使用选择菜单，则应注意：

1. It is designed for use as part of a form
2. It is relatively unfriendly to search engines
3. It gives a UI that doesn't indicate to the user that it is a navigational tool

1. 它旨在用作表单的一部分
2. 对搜索引擎比较不友好
3. 它提供的 UI 不会向用户表明它是一个导航工具

Then (note that steps 4 and onwards are optional):

然后（请注意，步骤 4 及以后的步骤是可选的）：

1. Add a form and remove the unordered list
2. Add a <input type="submit" value="Go">button
3. Write a server side program (referenced in the actionattribute of the form) that checks what the value of the select is, and then outputs a 302 FoundHTTP status and a Locationheader with the URL you wish the browser to go to.
4. Add a JavaScript event handler (either on the form's submitevent or the select's changeevent)
5. Have it check the value of the selected option
6. Set the locationproperty to the desired destination
7. Cancel the default behaviour of the form

1. 添加表单并删除无序列表
2. 添加<input type="submit" value="Go">按钮
3. 编写一个服务器端程序（在action表单的属性中引用），检查 select 的值是什么，然后输出一个302 FoundHTTP 状态和一个Location带有您希望浏览器转到的 URL的标头。
4. 添加 JavaScript 事件处理程序（在表单submit事件或选择change事件上）
5. 让它检查所选选项的值
6. 将location属性设置为所需的目的地
7. 取消表单的默认行为

回答by Hadi Sharifi

If you what to create menu using ul you can use same this

如果您使用 ul 创建菜单，您可以使用相同的

 <div class="fleft">
            <ul id="cd-dropdown" class="cd-select">
                <li value="-1" selected>OUR SERVICES</li>
                <li class="icon-corporate">Corporate Branding</li>
            </ul>
        </div>

If you need drop down you should use

如果你需要下拉你应该使用

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>