一些JS基本小内容

获取select选中内容：

1、获取select表单内容

<select id="sel">
    <option value="v1">1</option>
   <option value="v2">2</option>
   <option value="v3">3</option>
</select>
Jquery获取选中的内容：
   $("#sel option:selected").val()    //获取到选中的value值，如v1,v2
   $("#sel option:selected").text()   //获取到选中的文本值  ，如1,2
javascript原生的方法
  1:拿到select对象： var  myselect=document.getElementById("sel");

  2：拿到选中项的索引：var index=myselect.selectedIndex ;             // selectedIndex代表的是你所选中项的index

  3:拿到选中项options的value：  myselect.options[index].value;

  4:拿到选中项options的text：  myselect.options[index].text;

View Code

2.获取表格内容

<table>
　　<tr>
            <td class="moveTag">移动</td>
            <td class="del">删除</td>
    </tr>
</table>
js:
function toArray(a) {
        return [].slice.call(a);
    }
    toArray(document.querySelectorAll('.moveTag')).forEach(function (v) {
        v.addEventListener('click', function () {
           //点击移动之后要做的事情
            //*******
        })
    })

View Code

3.监视滚动条事件

<div class="white-bg" style="height:500px;">
       <div style="height:800px; overflow: auto;"></div>
</div>

$(document).ready(function () {
     var nScrollHight = 0; //滚动距离总长(注意不是滚动条的长度)
     var nScrollTop = 0; //滚动到的当前位置
     var nDivHight = $(".white-bg").height();
     $(".white-bg").scroll(function () {
             nScrollHight = $(this)[0].scrollHeight; 
             nScrollTop = $(this)[0].scrollTop;
             if (nScrollTop + nDivHight >= (nScrollHight-100))
            {  
 //nScrollTop + nDivHight >= (nScrollHight-100)表示滚动条距离页面底部100培px的时候，也可以为nScrollTop + nDivHight >= nScrollHight表示滚动到底部之后进入if条件
               /*滚动条滚动到指定位置之后所要执行的事情在此编写*/
                
            }
     });
})

View Code

4.获取指定div的style/给指定div设置css样式

<div id="appDownload">
    
</div>
<div class="codeweixin"></div>

<script>
 $(document).ready(function(){
       if ($('#appDownload').css('display')!= "none") {
                        $(".codeweixin").css("margin-bottom", "70px")
       } else {
               $(".codeweixin").css("margin-bottom", "")
       }  
  })
</script>
  //获取css样式$('#appDownload').css('display')
  //设置css样式$(".codeweixin").css("margin-bottom", "")

View Code

5.js分割字符串并获取最后一个元素split()

//方法1 内置pop()方法
var val ="C:fakepathtn5.png"；
var arr = val.split("\");    //以为分隔符分割字符串，arr=["C:", 
                                      //   "fakepath", "btn5.png"]
var lat = arr.pop();    //获取最后一个元素  btn5.png,此时arr=["C:", 
                                //    "fakepath"]

                          //pop()方法在获取了数组的最后一个元素的同时也将原数组的最后一个元素给删除了。如果数组已经为空，则该方法不改变数组，并返回 undefined 值



//方法2
var val ="C:fakepathtn5.png"；
var arr = val.split("\");    //以为分隔符分割字符串，arr=["C:", 
                                      //   "fakepath", "btn5.png"]
var lat = arr[arr.length-1];    //获取最后一个元素  btn5.png

View Code

6.js合并字符串Join()

var arr = ["a","b","c"];
var join = arr.join("/");
//此时join就连接了字符串，join  = "a/b/c"

View Code

7.Js对文本框验证输入只能为数字等内容

 1 <div>
 2         验证只能输入数字<input type="text" onkeyup="javascript:ReNumber1(this)" /><br />
 3         验证只能输入指定范围内的数字(0-100)<input type="text" onkeyup="javascript:ReNumber(this)" /><br />
 4         验证只能输入数字和小数点<input type=text t_value="" o_value="" onkeypress="javascript: keyPress(this)" onkeyup="    javascript: keyUp(this)" onblur="    javascript: onBlur(this)"><br />
 5         只能输入英文字母和数字,不能输入中文<input onkeyup="value=value.replace(/[^w./]/ig,'')"><br />
 6         只能输入数字和英文(只能输入数字)<input onkeyup="value=value.replace(/[^d|chun]/g,'')"><br />
 7         小数点后只能有最多两位(数字,中文都可输入),不能输入字母和运算符号:<input onkeypress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 || /.dd$/.test(value))event.returnValue=false">
 8     </div>
 9     <script>
10         //验证文本框只能输入数字和小数点
11         function keyPress(ob) {
12             if (!ob.value.match(/^[+-]?d*?.?d*?$/))
13                 ob.value = ob.t_value;
14             else ob.t_value = ob.value;
15             if (ob.value.match(/^(?:[+-]?d+(?:.d+)?)?$/))
16                 ob.o_value = ob.value;
17             if ((event.keyCode < 48 || event.keyCode > 57) && event.keyCode != 46 || /.dd$/.test(ob.value))
18                 event.returnValue = false
19         }
20         function keyUp(ob) {
21             if (!ob.value.match(/^[+-]?d*?.?d*?$/)) ob.value = ob.t_value; else ob.t_value = ob.value; if (ob.value.match(/^(?:[+-]?d+(?:.d+)?)?$/)) ob.o_value = ob.value;
22         }
23         function onBlur(ob) {
24             if (!ob.value.match(/^(?:[+-]?d+(?:.d+)?|.d*?)?$/)) ob.value = ob.o_value; else { if (ob.value.match(/^.d+$/)) ob.value = 0 + ob.value; if (ob.value.match(/^.$/)) ob.value = 0; ob.o_value = ob.value };
25         }
26        
27         // 验证文本框只能输入数字
28         function ReNumber1(obj) {            
29             var count = 100;  //count为指定范围的数字
30             var reg = "/^[d]+$/g";      //验证只能输入数字的正则
31             //if (obj.value > count || obj.value == 0) {
32             //    obj.value = "";　　　　　　//输入内容不合格时文本框内容为""
33             //    return false;
34             //}
35             if (obj.constructor == String) {
36                 var re = obj.match(reg);
37                 return true;
38             }
39             obj.value = obj.value.replace(/D/g, '');　　//输入的内容不符合要求时不显示在文本框，自动删除
40             return false;
41         }
42         //验证文本框只能输入指定范围内的正数
43         function ReNumber(obj) {                            
44             var count = 100;  //count为指定范围的数字
45             var reg = "/^[d]+$/g";      //验证只能输入数字的正则
46             if (obj.value > count || obj.value == 0) {
47                 obj.value = "";　　　　　　//输入内容不合格时文本框内容为""
48                 return false;
49             }
50             if (obj.constructor == String) {
51                 var re = obj.match(reg);
52                 return true;
53             }
54             obj.value = obj.value.replace(/D/g, '');　　//输入的内容不符合要求时不显示在文本框，自动删除
55             return false;
56         }
57     </script>

View Code

8.设置元素的disabled属性：

$("#submitBtn").attr("disabled","disabled")
$("#submitBtn").attr("disabled","")
移除disabled属性：
$('#submitBtn').removeAttr("disabled");

View Code

9.获取指定类名的元素的display属性：

$(".manageMode").each(function () {
        //判断每一个div，其css中display是否为block
        if($(this).css("display")=="block"){
           console.log("这个就是你所要找的了")   
        }
}）

View Code

10.判断某个字符串是否包含另一字符串

var a = "天下，大同，一致";
var b = "天下";
var c = "大地"；

var d = a.indexOf(b);  （d>=0代表包含，反之则不包含）
var e = a.indexOf(c);    (e=-1代表不包含)

View Code