JQ共通DEMO

1:

//このコードは、
//ユーザーが値を入力しない場合に
//デフォルト値を保持する方法を示しています
wap_val = [];
$("。 swap").each(function(i){
wap_val[i] = $(this).val();
$(this).focusin(function(){
if ($(this).val() = = swap_val[i]) {
$(this).val("");
}
}).focusout(function(){
if ($.trim($(this).val()) == " ") {
$(this).val(swap_val[i]);
}});});

2:

var el = $('#id');
el.html(el .html().replace(/word/ig, ''));

3：

$('button.someClass').live('click', someFunction);
//jQuery の場合に注意してください1.4.2 では、より優れたコンテキスト サポートを提供するため、live の代わりにデリゲートおよびデリゲート解除オプション
// が導入されました
// たとえば、テーブルの場合、以前は
//.live()
$( "テーブル").each(function(){
$("td", this).live("hover", function(){
$(this).toggleClass("hover");
});
} );
//今度は
$("table").delegate("td", "hover", function(){
$(this).toggleClass("hover");
});

4 を使用します:

作成した要素を DOM に動的に追加する方法:

var newDiv = $('');

newDiv.attr('id','myNewDiv').appendTo('body'); 5：

var cloned = $('#somediv').clone();

6：

if($(element).is(':visible') == ' true') {

//要素は表示されます

}

7:

JQ 位置決め

jQuery.fn.center = function () {

this.css('position','absolute');

this.css('top', ( $(window).height() - this.height() ) / +$(window).scrollTop() + 'px');

this. , ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + 'px');

return this;

/ /上記の関数を使用します。このように:

$(element).center();

8:

特定の名前を持つすべての要素の値を配列に入れる方法:

var arrInputValues = new Array(); $("input[name='table[]']").each(function(){

arrInputValues.push($(this).val());

});

9:

jQuery で .siblings() を使用して兄弟要素を選択する方法

$('#nav li').click(function(){

$('#nav li').removeClass ('active');

$(this).addClass('active');

});

//代替案は
$('#nav li').click(function(){
$(this) .addClass('active' ).siblings().removeClass('active');
});




10：

ポジティブ選択とネガティブ選択

var tog = false

$('a' ).click(function) () {

$("input[type=checkbox]").attr("checked",!tog)

11:

の取得方法マウスパッドのカーソル位置 x と y

$(document).ready(function() {

$(document).mousemove(function(e){

$('#XY').html("X 軸: ” + e.pageX + ” クリック可能になります

$("ul li").click(function(){window.location=$(this).find("a").attr("href");

return false;

} );

13:


画像が完全に読み込まれたかどうかを確認する方法

$('#theImage').attr('src', 'image.jpg').load( function() {

alert ('この画像は読み込まれています');

});

14:

Cookie が有効かどうかを確認する方法

var dt = new Date();
dt.setSeconds( dt.getSeconds() + 60) ;

document.cookie = "cookietest=1;expires=" + dt.toGMTString();

var cookiesEnabled = document.cookie.indexOf("cookietest=") != -1; if(!cookiesEnabled) {/ /Cookie が有効ではありません

}

15;

Cookie を期限切れにする方法:

var date = new Date();

date.setTime(date.getTime() + (x * 60 * 1000)) ;

$.cookie('example', 'foo', { 有効期限: date });