我有这个:
<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)。
我该怎么做?
答案 0 :(得分:5)
我不确定你的目的是什么。如果要在单击复选框时重定向到页面,可以执行此操作
使用数据属性
指定要在复选框元素中调用的网址<input type="checkbox" data-target="http://www.facebook.com" />
脚本
$(function(){
$("input[type='checkbox']").change(function(){
var item=$(this);
if(item.is(":checked"))
{
window.location.href= item.data("target")
}
});
});
示例JsFiddle:http://jsfiddle.net/45aZ8/2/
编辑:如果您想在新窗口中打开它,请使用window.open
方法而不是更新当前网址
替换
window.location.href= item.data("target")
带
window.open(item.data("target")
http://www.w3schools.com/jsref/met_win_open.asp
编辑3 :基于评论:如果您想在Checked状态下加载一个网址并在取消选中时加载另一个网址,则可以这样做
为每个复选框提供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/>
脚本是
$(function(){
$("input[type='checkbox']").change(function(){
var item=$(this);
if(item.is(":checked"))
{
window.open(item.data("target"))
}
else
{
window.open(item.data("target-off"))
}
});
})
答案 1 :(得分:0)
$('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
}
}
});
答案 2 :(得分:0)
$('#id_connected_to_facebook, #id_connected_to_twitter').click(function(){
$.post('http://target.url', {this.id:this.checked});
});
现在你将获得$ _POST id_connected_to_facebook或id_connected_to_twitter,作为一个值,它将是1或0