Question

JS多个IF语句能不能缩短一点?

<input type="checkbox" name="A1" value="hd1" onclick="check1()"/>
<input type="checkbox" name="A2" value="hd2" onclick="check1()"/>
<input type="checkbox" name="A3" value="hd3" onclick="check1()"/>
<input type="checkbox" name="A4" value="hd4" onclick="check1()"/>

if (document.getElementById("A1").checked == true &&
document.getElementById("A2").checked == true){
alert ("111");
}
if (document.getElementById("A3").checked == true &&
document.getElementById("A4").checked == true){
alert ("222");
}
以上 要判断很多很多 能缩短点吗？

Answer 1

能不能缩短，主要看你的if里的语句块，如果都是一句的，可以用三元运算。如：

var a = 10;
if(a>10){
    alert(true);
}else{
    alert(false);
}
可以写成： a>10?alert(true):alert(false);
如果语句块不是一句，那就没有什么办法了。

Answer 2

主要长在document.getElementById这个方法上了,使用类JQ的方法就可以把这个方法简化,另外,==true完全没有必要写了,对于只包含一条语句的条件块也可以不写大括号而直接写在一行上.
简化结果如下:

var $=function(id){return document.getElementById(id).checked;};
if($('A1') && $('A2')) alert('111');
if($('A3') && $('A4')) alert('222');

追问

请问 alert ('XX');后面如果多一句document.getElementById("A1").checked = false;
也就是checkbox前面的对钩做取消操作.
if($('A1') && $('A2')) {
alert('HD与SD只能选择1个');
$('A1') = false;
$('A2') = false;
}
这么做系统不执行 后面2个语句 能告诉我什么原因吗？

追答

那你就需要这样了,可能比之前的稍长一点
var $=function(id){return document.getElementById(id);};
if($('A1').checked && $('A2').checked){
alert('HD与SD只能选择1个');
$('A1').checked = $('A2').checked = false;
}
因为之前的语句$返回的是一个值而非一个对象,如果返回的是对象,那么实际返回是对该对象的引用,而如果返回属性值,那么返回的是该值的一个副本,对副本的修改不会反映在对象属性上.

追问

谢谢你.又学到东西了.最后一个问题.
if($('A1').checked && $('A2').checked)
这里把A1 A2=true 给缩写了.
那么如果是false是不是只能这么写了呢？
if($('A1').checked = false && $('A2').checked = false)

追答

同样不需要,因为你的表达式返回的值就是一个布尔值,if语句完全可以使用表达式的值进行工作,将两个布尔值进行比较是很多余的.比如你的表达式 $('A1').checked 返回值就是 true
那么你再用==true不是相当于true==true,这有什么意义呢,false也是如此.

Answer 3

<input type="checkbox" name="A1" value="hd1" onclick="check1()"/>
<input type="checkbox" name="A2" value="hd2" onclick="check1()"/>
<input type="checkbox" name="A3" value="hd3" onclick="check1()"/>
<input type="checkbox" name="A4" value="hd4" onclick="check1()"/>

var $=function(id){return document.getElementById(id);};

var a1=$("A1").checked;
var a2=$("A2").checked;
var a3=$("A3").checked;
var a4=$("A4").checked;

if (a1 == true && a2 == true){ alert ("111"); }
if (a3 == true && a4 == true){ alert ("222"); }

Answer 4

这样够简单了吧?

function check(id) { return document.getElementById(id).checked; }

check('A1') && check('A2') && alert('111');
check('A3') && check('A4') && alert('111');

你要还嫌"check"长 可以把"check"换成"c"

Answer 5

用 if else 再就是==true不需要写。。{}这两个东西可以省略