Summary of jquery simple application examples

Summary of jquery simple application examples_jquery

WBOY

Release： 2016-05-16 17:25:53

Original

1202 people have browsed it

1. Specify the subpage content to be displayed in a div on the main page, where renderContainer can be the id or name of the main page div

Copy code The code is as follows:

 
$.ajax({ 
url: url, 
data: parameters, 
type: "GET", 
dataType: "html ", 
success:function (html) { 
$(renderContainer).attr("title", title); 
$(renderContainer).html(html); 
$(renderContainer). dialog({ 
autoOpen: true, 
width: 590, 
height: 720, 
modal: true, 
resizable: false, 
draggable: true 
}); 
} 
}); 

2. Select the specified ID of the specified attribute of the specified table to perform a certain action

Copy Code The code is as follows:

$(".tbl_checked tr[userid='" idArray[i] "']").remove();

3. Delay loading trigger event, select the checked checkbox whose id contains the "userid" field, and put their id in the idArray array

Copy code The code is as follows:

 
$("#authorize_reset").live('click',function(){ 
var idArray = []; 
$(":checkbox[id^='userid']").each(function(){ 
if($(this).attr("checked") == "checked") { 
idArray.push(parseInt($(this).val())); 
} 
}); 
}); 
}); 

3. Another way to select the checkbox whose id contains the "userid" field and is checked

Copy code Code As follows:

 
$(":checkbox[id^='userid'][checked]").each(function(){ 
selectedRoleIdArray.push(parseInt($(this). val())); 
}); 

4. Simple and practical click to change the style

Copy code The code is as follows:

 
$(function(){ 
$(".tbl_checked tr").live('click', function(){ 
var target = $(this); 
if(target.attr("class") == "tr_checked") { 
target.removeClass("tr_checked"); 
} else { 
target.addClass ("tr_checked"); 
} 
}) 

5. The time comparison in "2012-12-21" format needs to be converted first

Copy code The code is as follows:

 
var compareTime = Date.parse(setTime.replace(/-/g, "/") ; > The code is as follows: 

(function ($) {
var FormatDateTime = function FormatDateTime() { };

$.FormatDateTime = function (days) { //var correcttime1 = eval('( new ' obj.replace(new RegExp("/", "gm"), "") ')'); var myDate = new Date(); myDate.setDate( myDate.getDate() days); var year = myDate.getFullYear(); var month = ("0" (myDate.getMonth() 1)).slice(-2); var day = ("0" myDate.getDate()).slice(-2);

var s=year "-" month "-" day;

return s ;
}
}) (jQuery);

The last is a similar two-way list made with jquery, which can exchange content left and right

Copy code

The code is as follows:

 
$(function(){ 
//Click to load user list, role user list
$(".add_remove_user").live('click',function() { 
var rid = $(".current").attr("id").substring("ut_".length); 
changeroleDialog(changeroleRoute.url(), {id: rid}, ".set_user_list"); 
}); 
 
$(".tbl_checked tr").live('click', function(){ 
var target = $ (this); 
if(target.attr("class") == "tr_checked") { 
target.removeClass("tr_checked"); 
} else { 
target.addClass(" tr_checked"); 
} 
}); 
$(".tb1_role_checked tr").live('click', function(){ 
var target = $(this); 
 if(target.attr("class") == "tr_checked_1") { 
target.removeClass("tr_checked_1"); 
} else { 
target.addClass("tr_checked_1"); 
 } 
}); 
 
 
 $("#addThisRole").live('click',function(){ 
if($(".tb1_role_checked tr").first().attr("default_value")=='noResult'){ 
var table = $(".tb1_role_checked"); 
$(".tb1_role_checked tr").remove(); 
var tr = $("") 
.append($("").html('Name')) 
.append($("").html ('account')) 
table.append(tr); 
} 
$(".tr_checked").each(function(){ 
$(this).remove(); 
var element = $(this); 
var id = element.attr("param_id") 
var name = element.attr("param_name") 
var account = element.attr("param_account ") 
var table = $(".tb1_role_checked"); 
var tr = $("") 
.append($("").html(element.attr("param_name"))) 
.append($("").html(element.attr("param_account"))) 
//table.append(tr); 
tr.insertAfter( $(".tb1_role_checked tr").first()); 
}); 

}); 
$("#deleteThisRole").live('click',function(){ 
if($(".tbl_checked tr").first().attr("default_value")=='noResult'){ 
var table = $(".tbl_checked"); 
$( ".tbl_checked tr").remove(); 
var tr = $("") 
.append($(" ").html('Name')) 
.append($("").html('Account')) 
table.append(tr); 
} 
$(".tr_checked_1").each(function(){ 
$(this).remove(); 
var element = $(this); 
var id = element. attr("param_roleid"); 
var name = element.attr("param_rolename"); 
var account = element.attr("param_roleaccount"); 
var table = $(".tbl_checked") ; 
var tr = $("") 
.append($("").html(element.attr("param_rolename"))) 
.append($("//table.insertBefore(tr, $(".tbl_checked tr").first()); 
tr.insertAfter($( ".tbl_checked tr").first()); 
}); 
}); 
}); 

Summary of jquery simple application examples_jquery

That’s all for now , the above code is not perfect yet, and I hope you will give me your advice on areas that need improvement.