Question

我只想在点击链接时显示“免费聊天”链接。它必须显示包含"yes"和"no"选项的下拉列表。

该链接不得转到任何地方，只有在选择"yes"时，它才必须重定向到某个页面。

我目前有代码：

<a href="" id="link" name="link" onClick="yesnolist(1)">Free Chat</a>

和我的Javascript：

<script type="text/JavaScript">
  function yesnolist()
  {
     var e = document.getElementById("link");
     var strUser1 = e.options[e.selectedIndex].value;
     if (strUser1 == "1")
        window.location.href = "http://.........";

     return strUser1;
  }
 </script>

Answer 1

我不确定我是否完全理解你的问题。

我假设您已说过链接：

<a href="" id="link" name="link" onClick="yesnolist(1)">Free Chat</a>

现在，当有人点击时，您是否希望它创建一个下拉列表？我不确定你是指一个锚元素旁边的下拉列表，还是用下拉列表替换锚元素。

我会建议，在任何时候，使用jQuery javascript，但因为它似乎你没有使用它：

<a href="#yesno" id="link" name="link">Free Chat</a>
<select id="yesno_id" name="yesno" style="display:none;">
    <option value="1">Yes</option>
    <option value="2">No</option>
</select>

即使它已经存在，我们也不会显示下拉列表。现在我们为#link和#yesno_id添加一个监听器（注意以下代码要么在标记之前，要么放在body onload listener中）。

<script type="text/javascript">
document.getElementById('link').addEventListener('click', function() {
    var yesno = document.getElementById('yesno_id');
    yesno.style.display = 'block';
    yesno.addEventListener('change', function() {
        if (this.value === '1') {
            window.location.href = "http://.........";
        }
        else {
            this.style.display = 'none';
        }
    }, true);

}, true);
</script>

我根本没有测试它，很可能会有错误（我甚至没有在编辑器上写它），但它应该给你一般的想法。

这里我们使用不引人注目的javascript：我们不会在HTML上添加任何JavaScript引用。我们只是拥有id和类，就像任何没有JS的HTML一样。然后我们使用JavaScript除了所有这些之外访问HTML元素，然后绑定click和change事件处理程序（相应于每个元素）。

如果此人点击该链接然后选择“否”，则会隐藏下拉菜单，如果显示“是”，则会重定向到您说的网址。实际上在锚点的href上有链接并取消事件传播会很好。然后从yesno_id事件处理程序中获取href并重定向到它。这样，如果JS被禁用，它将直接带你到页面（虽然它不会“确认”）。

Answer 2

实际上我不知道你想做什么..但是尝试下面的代码来完成你的任务。

<a href="" id="link" name="link" onClick="yesnolist()">Free Chat</a>


<script type="text/JavaScript">
  function yesnolist()
  {
     var e = confirm('are you want to sure...?');

     if (e == ture)
        window.location.href = "http://.........";
      else
        return false;

    }
 </script>

这对你有帮助..

感谢。

Answer 3

我前几天发现了这个JQuery插件，我相信它会完全符合您的要求：

http://thrivingkings.com/apprise/

请参阅页面上的示例，了解如何执行“是/否”框。

Answer 4

块引用 inintial loading页面隐藏了那个div

点击延迟1000的div节目

块引用

你会变得像一个下降的视觉

单击链接以显示下拉列表

4 个答案: