JQuery 技巧积累与总结

1.获得select 元素选中的值

$('#WishlistSelect option:selected').val();

2.设置按钮的disabled属性的实现代码

$('#button').attr('disabled',"true");添加disabled属性
$('#button').removeAttr("disabled"); 移除disabled属性 

3.处理字符串空格

<script type="text/javascript">
     var sString = "   1234567890   ";
     sString = $.trim(sString);
     alert(sString.length);
</script>

字符串sString的首尾空格都被jQuery取掉了其中

$.trim(sString)

相当于

jQuery.trim(sString)

4. 通过过滤器查找页面元素

$("#emailUsForm")
                .find('#emailForm')
                .find('input, textarea')
                .each( function(){
   
    if( $(this).hasClass('textarea') && $(this).hasClass('required') && $(this).is(":visible") ){
                        console.log("message $(this).val()=" + $(this).val() );
                    
                }
            
                        
});

5. 处理带有特殊字符的id

一般情况下，在jQuery选择器中很少会用到诸如“.”、“#”、“(”、“[”等特殊字符,但是在实际应用中，偶尔也会遇到表达式中含有"." 等特殊字符。要想让jQuery能处理这些特殊字符，使用普通的方式处理的话，是不行的，是必须要进行转义的。

<DIV id=‘id.a’>aa</DIV>
<DIV id=’id#b‘>bb</DIV>

var $id_a  = $('#id.a');//jQuery对象，实际上是没取到元素的
var $id_b  = $('#id#b');//jQuery对象，实际上是没取到元素的
alert( $id_a.length);//输出0
alert( $id_b.length);//输出0 

var $id_right_a  = $('#id\\.a');//jQuery对象,对特殊字符需要转义一下
var $id_right_b  = $('#id\\#b');//jQuery对象,对特殊字符需要转义一下
alert( $id_right_a.html() );//正确输出"aa"
alert( $id_right_b.html() );//正确输出"bb"

 

6. closest() 方法获得匹配选择器的第一个祖先元素，从当前元素开始沿 DOM 树向上。

 语法

.closest(selector)

 

参数	描述
selector	字符串值，包含匹配元素的选择器表达式。

 

 

例子

<form action="#" method="get">
            <label class="expandableMenu-item">
                <input type="hidden" name="q" value='${facetValue.query.query.value}'/>
                <input type="hidden" name="text" value="${searchPageData.freeTextSearch}"/>
                <input type="checkbox" ${facetValue.selected ? 'checked="checked"' : ''} onchange="$(this).closest('form').submit()"/>
                     ${facetValue.name} (${facetValue.count})
            </label>
</form>

 

Ajax

1 Jquery 获取返回值的中文乱码问题解决

后端Server业务代码设置,

public void searchUser(HttpServletRequest request, HttpServletResponse response) throws IOException{
　　String json ="{name: '王五', address: '帝都'}";
　　//这里不设置编码会有乱码
    request.setCharacterEncoding("utf-8");
    response.setContentType("text/html;charset=utf-8");
    response.setHeader("Cache-Control", "no-cache"); 
　　 //输出中文，这一句一定要放到response.setContentType("text/html;charset=utf-8"),  response.setHeader("Cache-Control", "no-cache")后面，
    //否则中文返回到页面是乱码 
　　 PrintWriter out = response.getWriter();   
    out.print(json.toString()); out.flush(); out.close();
}

 

2. 在页面通过ajax传递汉字时，需要转码

转码函数：encodeURIComponent()

var keyWord = clientMgrManage.searchKeyWord();        
var param = "param="+encodeURIComponent(JSON.stringify({"startpage": "" + page,"pagesize": "" + self.pageSize}));

$.ajax({
           type:'GET',
           url: "/auth/api/tenants",
           contentType:"application/json",
           dataType: "json",
           data: param ,
           async: false,
           success: function (json) {
                  
           },
　　　　　　error : function(XMLHttpResponse) {
                          
          }
 });