绑定一个点击事件到三个不同的链接

我写了一个类似于这个例子的简单脚本。问题是click事件只绑定到条件语句中的第一个#id。我之所以想到为什么会发生这种情况，是因为在每个语句中没有任何内容将点击函数中的ID与类相关联，但是当我尝试添加一个var时，点击根本不会触发。请告诉我哪里出了问题。感谢绑定一个点击事件到三个不同的链接

$(document).ready(function(){ 
     $('.someclass').bind('click', function() { 
      if('#id1') 
      { 
      window.location = "someURL"; 
      } 
      else if('#id2') 
      { 
      window.location = "someURL2"; 
      } 
      else if('#id3') 
      { 
       window.location = "someURL3"; 
      } 
      }); 
    });

来源

2012-10-06 user1725382

你想重塑超链接吗？ –

@ŠimeVidas，+1为你的想法:) – Jashwant

既然你已经使用ID为您的元素，你应该使用它们seperately绑定的点击功能。它更容易和它的作品:)

$(document).ready(function(){ 
    $('#id1').click(function(){ 
     window.location = "someURL"; 
    }); 
    $('#id2').click(function(){ 
     window.location = "someURL2"; 
    }); 
    $('#id3').click(function(){ 
     window.location = "someURL3"; 
    }); 
});

如果你喜欢原来的更好的方式（你不应该;-)），那么试试这个：

 if($(this).attr("id") == 'id1') 
     { 
     window.location = "someURL"; 
     }

来源

2012-10-06 16:25:51 Horen

我这样做了，然后认为我应该写一个条件语句。也许我应该回到原来的方式。 – user1725382

更新了答案... – Horen

您可以检查自己的身份证是这样的

$(document).ready(function() { 
    $('.someclass').bind('click', function() { 
     if(this.id === 'id1') { 
      window.location = "someURL"; 
     } else if(this.id === 'id2') { 
      window.location = "someURL2"; 
     } else if(this.id === 'id3') { 
      window.location = "someURL3"; 
     } 
    }); 
});

来源

2012-10-06 16:28:13 Jashwant

你可以用'switch'语句去掉代码重复。 –

我更喜欢'如果'。另外，我只是想保持OP的编码风格。如果你要求我这样做，我会用你的方式或一个对象与'keys'作为元素和'价值'的id作为url – Jashwant

考虑：

<span data-url="someURL">Link 1</span> 
<span data-url="someURL2">Link 2</span>

然后：

$wrapper.on('click', 'span', function() { 
    window.location = $(this).data('url'); 
});

其中$wrapper包含DOM元素，其中包含所有的“链接”。

这里的想法是将数据从JavaScript代码（=行为）中分离出来。您的网址应该位于DOM中 - 您可以使用data-*属性来存储它们（如上所示）。

来源

2012-10-06 16:30:26

+1，这就是要走的路 – Jashwant

我想你是在思考问题，也不知道你在用什么。我会利用链接上的数据属性。我会假设他们不是典型的具有HREF的A标签，因为如果是这样的话，您不应该使用JavaScript。

<div data-url="http://www.someurl1.com">...</div> 
<div data-url="http://www.someurl2.com">...</div> 
<div data-url="http://www.someurl3.com">...</div> 

<script> 
    $('body').on('click','div[data-url]', function(ev) { 
     ev.preventDefault(); 
     window.location = $(this).data('url'); 
    } 
</script>

来源

2012-10-06 16:34:09

糟糕，看起来像我迟到了去派对。我会修改我的答案，以便更加简洁地区分。 –

如果我的理解是你的要求是正确的，你有一个名为“SomeClass的”具有超链接到它的CSS类。你需要通过jQuery动态设置这些超链接的URL，我是否正确？如果是这样，那么你可以尝试下面的代码：

<script type="text/javascript" src="../Scripts/jQuery/jquery-1.7.2.js"></script> 
<script type="text/ecmascript"> 
    $(document).ready(function() { 

     $(".someclass > a").live("click", function() { 
      var currentID = $(this).attr("id"); 
      if (currentID == "id1") { 
       window.location = "http://google.com"; 
      } 
      else if (currentID == "id2") { 
       window.location = "http://stackoverflow.com"; 
      } 
      else if (currentID == "id3") { 
       window.location = "http://jquery.com"; 
      } 
     }); 
    }); 

</script> 

<div> 
    <div class="someclass"> 
     <a id="id1">id 1</a> 
     <a id="id2">id 2</a> 
     <a id="id3">id 3</a> 

    </div> 
</div>

来源

2012-10-06 17:08:51 superachu

绑定一个点击事件到三个不同的链接

回答

相关问题