Javascript jQuery,如何通过选中复选框来调用url

Javascript jQuery,如何通过选中复选框来调用url,javascript,jquery,Javascript,Jquery,我有这个: <span id="social"> Facebook: <input id="id_connected_to_facebook" type="checkbox" name="connected_to_facebook"> <br> Twitter: <input id="id_connected_to_twitter" type="checkbox" name="connected_to_twitte

我有这个:

<span id="social">
    Facebook:
    <input id="id_connected_to_facebook" type="checkbox" name="connected_to_facebook">
    <br>
    Twitter:
    <input id="id_connected_to_twitter" type="checkbox" name="connected_to_twitter">
    <br>
</span>

脸谱网:

推特:
对于jQuery,我想为所有4个可能的操作调用一个不同的URL(1:检查facebook,2:取消选中facebook,3:检查twitter,4:取消选中twitter)


我该怎么做呢?

我不知道你要干什么。如果要在单击复选框时重定向到页面,可以执行此操作

$('input[type="checkbox"]').change(function() {
  if($(this).is(':checked')) {
     if($(this).attr('id') == 'connected_to_facebook') {
        // possibility: 1
     } else {
       // possibility: 3
     }
  } else {
    if($(this).attr('id') == 'connected_to_facebook') {
       // possibility: 2
     } else {
       // possibility: 4
     }
  }
});
使用数据属性指定要在复选框元素中调用的url

<input type="checkbox" data-target="http://www.facebook.com" />
示例JSIDLE:

编辑:如果要在新窗口中打开它,请使用
窗口。打开
方法,而不是更新当前url

替换

window.location.href= item.data("target")

编辑3基于评论:如果要在选中状态下加载一个url,在取消选中状态下加载另一个url,可以执行以下操作

为每个复选框指定2个数据属性。一个用于选中状态,一个用于未选中状态

Facebook<input type="checkbox" data-target="http://www.facebook.com" data-target-off="http://www.google.com"  /> <br/>
Twitter<input type="checkbox" data-target="http://www.twitter.com" data-target-off="http://www.asp.net"  /> <br/>

工作样本:

我不确定你想要什么。如果要在单击复选框时重定向到页面,可以执行此操作

使用数据属性指定要在复选框元素中调用的url

<input type="checkbox" data-target="http://www.facebook.com" />
示例JSIDLE:

编辑:如果要在新窗口中打开它,请使用
窗口。打开
方法,而不是更新当前url

替换

window.location.href= item.data("target")

编辑3基于评论:如果要在选中状态下加载一个url,在取消选中状态下加载另一个url,可以执行以下操作

为每个复选框指定2个数据属性。一个用于选中状态,一个用于未选中状态

Facebook<input type="checkbox" data-target="http://www.facebook.com" data-target-off="http://www.google.com"  /> <br/>
Twitter<input type="checkbox" data-target="http://www.twitter.com" data-target-off="http://www.asp.net"  /> <br/>
工作样本:

现在,您将在$u帖子中看到id\u connected\u to\u facebook或id\u connected\u to\u twitter,其值为1或0


现在你将在$帖子中看到id连接到facebook或id连接到twitter,其值为1或0

@core1024:yea。感谢代码悖论的加入和修复。对不起,我不是很清楚,我希望当前页面保持打开状态。我希望用户将帐户与社交帐户相关联,为此我使用了一些URL。这只是加载URL的问题,但由于复选框位于配置文件页面上,因此离开页面并不方便。我不知道如何用jQuery处理这个问题。它看起来不错,但我对jQuery不太熟练,我应该把我的4个URL(FB connect和disconnet,Twitter connect和disconnect)放在哪里?我不确定,但我相信这可以和跨度的id联系起来,对吗?因为我在这页上有更多的复选框。@Bastian:检查我的例子。使用HTML5数据属性来存储我看到的URL OK,但当复选框未选中时,我需要加载不同的URL。基本上,当它被选中时,它应该加载类似于facebook/connect的内容,而当它被取消选中时,它应该转到facebook/disconnect,对于另一个也一样。@core1024:是的。感谢代码悖论的加入和修复。对不起,我不是很清楚,我希望当前页面保持打开状态。我希望用户将帐户与社交帐户相关联,为此我使用了一些URL。这只是加载URL的问题,但由于复选框位于配置文件页面上,因此离开页面并不方便。我不知道如何用jQuery处理这个问题。它看起来不错,但我对jQuery不太熟练,我应该把我的4个URL(FB connect和disconnet,Twitter connect和disconnect)放在哪里?我不确定,但我相信这可以和跨度的id联系起来,对吗?因为我在这页上有更多的复选框。@Bastian:检查我的例子。使用HTML5数据属性来存储我看到的URL OK,但当复选框未选中时,我需要加载不同的URL。基本上,当它被选中时,它应该加载类似于facebook/connect的内容,当它被取消选中时,它应该转到facebook/disconnect,对于另一个也应该如此。不要使用onchange方法。在MSIED中,如果不使用onchange方法,会变得很疯狂。在MSIE里简直是疯了
$('#id_connected_to_facebook, #id_connected_to_twitter').click(function(){
   $.post('http://target.url', {this.id:this.checked});
});