一个简单的例子，实现两个值交替弹出
我的业务需求是这样：当隐藏内容是显示状态时传1个值给后台，非显示状态时显示另一个值给后台，这样就有了下面这个交替弹出不同值的例子。
例1：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>Document</title> 8 <script src="https://cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script> 9 </head> 10 <body> 11 <div id="open_close"> 12 <!-- js 控制 展开 隐藏div --> 13 <img width="20px" style="border:1px solid red;cursor:pointer" src="https://www.cnblogs.com/images/cnblogs_com/heyiming/947284/t_helpbot.png" 14 onclick="give_types(this)"> 15 <!--this 指 img 对象 --> 16 <div id="hide_contents" style="border:1px solid #ccc; width:300px; height:200px; display: block;"> 17 我是隐藏的那些值 18 </div> 19 </div> 20 <script type="text/javascript"> 21 //简单，复杂类型值交替传到后台 22 var i = 0; 23 24 function give_types(obj) { 25 var k = 0; 26 i++; 27 if (i % 2 == 0) { 28 k = 2; 29 } else { 30 k = 1; 31 } 32 alert(k); 33 var div_types = document.getElementById("hide_contents"); 34 if (div_types.style.display == "block") { 35 div_types.style.display = "none"; 36 obj.src = "https://www.cnblogs.com/images/cnblogs_com/heyiming/947284/t_up.png"; 37 } else { 38 div_types.style.display = "block"; 39 obj.src = "https://www.cnblogs.com/images/cnblogs_com/heyiming/947284/t_helpbot.png"; 40 } 41 } 42 </script> 43 </body> 44 </html>
例2：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>Document</title> 8 </head> 9 <body> 10 <input type="hidden" id="num" value="0" /> 11 <!--隐藏的input用来获取判断的值--> 12 <input type="button" onclick='click_val()' value="点击"/> 13 <script type="text/javascript"> 14 function click_val() { 15 var hidden_val = $("#num").val(); //获取隐藏的input的值 16 if (hidden_val == 1) { //如果是1 17 num = 1; //num赋值1 18 $("#num").val(0); //将取隐藏的input的值改为0 19 } else { //如果不是1 20 num = 0; //num赋值0 21 $("#num").val(1); //将取隐藏的input的值改为1 22 } 23 alert(num); //弹出num 24 } 25 </script> 26 </body> 27 </html>
（点击之后，交替弹出0,1）
例3：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>交替弹出</title> 8 </head> 9 <body> 10 <input type="button" onclick='myClick()' value="点击" /> 11 <script type="text/javascript"> 12 var i = 0; 13 function myClick() { 14 var k = 0; 15 i++; 16 if (i % 2 == 0) { 17 k = 2; 18 } else { 19 k = 1; 20 } 21 alert(k); 22 } 23 </script> 24 </body> 25 </html>
(点击后，交替弹出1,2)
