切换背景位置两次
toggle background-position TWICE
我想通过单击同一按钮两次来取消选择该按钮。
单击"女性"或"男性"后,脚本会更改背景位置并将数据正确插入性别输入中,但如果再次单击(两次),我想将相同的按钮返回到其原始位置并删除性别输入字段中的结果。
任何人都可以建议修改我的脚本吗?
这应该是一个单独的脚本吗?
谢谢
http://jsfiddle.net/B4XkL/5/
$(function(){
$("input[type='button']").click(function() {
$("input[type='button']").removeClass("button-toggle-on");
$(this).addClass("button-toggle-on");
if($(this).hasClass("gnF")) varval = 'female';
else varval = 'male';
$("#gender").val(varval);
});
});
这将解决问题:
$(function(){
$("input[type='button']").click(function() {
if($(this).hasClass("button-toggle-on")) {
$(this).removeClass("button-toggle-on");
$("#gender").val("");
}
else {
$(".button-toggle-on").removeClass("button-toggle-on");
$(this).addClass("button-toggle-on");
$("#gender").val(($(this).hasClass("gnF"))? "female" : "male");
}
});
});
像这样:
$(function(){
$("input[type='button']").click(function() {
if ($(this).hasClass("button-toggle-on")) {
$(this).removeClass("button-toggle-on");
$("#gender").val('');
} else {
$("input[type='button']").removeClass("button-toggle-on");
$(this).addClass("button-toggle-on");
if($(this).hasClass("gnF")) varval = 'female';
else varval = 'male';
$("#gender").val(varval);
}
});
});
看看这个演示。
var $buttons = $("input[type='button']");
$buttons.click(function() {
$buttons.not(this).removeClass('button-toggle-on');
$(this).toggleClass('button-toggle-on');
var varval = '';
if ($(this).hasClass('button-toggle-on')) {
varval = $(this).hasClass('gnF') ? 'female' : 'male';
}
$("#gender").val(varval);
});
相关文章:
- Meteor Router数据函数被调用两次
- 从MySQL数据库中获取输入数据需要两次页面刷新
- Module.start()已激发两次
- Jquery点击事件必须点击两次
- Append元素在运行两次函数后不显示
- 防止双击执行两次jQuery post请求
- 我必须点击两次才能激活任何按钮操作(离子/角度)
- 单击jQuery会激发两次
- 如何避免在树上走两次
- button.单击两次删除附加操作后不工作
- 由于$compile,Javascript(Angular)嵌套指令加载了两次
- 单击元素两次后执行操作
- AngularJs正在阻止链接被点击两次
- 为什么我的路线处理程序会触发两次
- 为什么Highchart在我的rails应用程序中加载了两次?(未捕获的Highcharts错误#16)
- 在列表中至少使用两次随机生成的nr
- 当图层重叠时,悬停对象在背景/前景元素上出现两次
- 切换背景位置两次
- 单击两次更改背景
- 如何穿't在这个随机背景js中连续两次具有相同的bg