'jquery'에 관한 글 3개

[jQuery] jQuery.load

JavaScript/jQuery 2014/01/03 12:45 [59197] 글쓴이 : 나그네

문법

    .load( url [, data ] [, complete(responseText, textStatus, XMLHttpRequest) ] )  Returns: jQuery
  • url
    Type: String
    A string containing the URL to which the request is sent.
  • data
    Type: PlainObject or String
    A plain object or string that is sent to the server with the request.
  • complete(responseText, textStatus, XMLHttpRequest)
    Type: Function()
    A callback function that is executed when the request completes.

셈플

  1. subpage/page_01.php 내용
    <div id="div_sub1"> 
    div: id=div_sub1
    <p> p: test 1</p>
    <p> p: test 2</p>
</div>
<div id="div_sub2"> div: id=div_sub2</div>
<div id="div_sub3"> div: id=div_sub3</div>
  2. subpage/page_01.php의 모든 내용 출력
    $("#button1").click( function(){
    $("#div_1").load("subpage/page_01.php", function(res, status, xhr){
        console.log( xhr );
    });
});
  3. subpage/page_01.php의 모든 내용중 P Tag element만 출력
    $("#button1").click( function(){
    $("#div_1").load("subpage/page_01.php p", function(res, status, xhr){
        console.log( xhr );
    });
});
  4. subpage/page_01.php의 모든 내용중 P Tag, ID가 div_sub2인 element만 출력
    $("#button1").click( function(){
    $("#div_1").load("subpage/page_01.php p,#div_sub3", function(res, status, xhr){
        console.log( xhr );
    });
});

 참고

"JavaScript / jQuery" 분류의 다른 글

[jQuery] jQuery가 지원하는 셀렉터들 (0)2014/01/02
[jQuery] DatePicker (0)2013/12/03
2014/01/03 12:45 2014/01/03 12:45
태그 : ,
걸린 글 0 / 덧글 0
글 걸기 주소 : 이 글에는 트랙백을 보낼 수 없습니다

[jQuery] jQuery가 지원하는 셀렉터들

JavaScript/jQuery 2014/01/02 19:55 [44627] 글쓴이 : 나그네

기본 선택

$("*")     : HTML Document 내의 모든 HTML요소 선택
$("div")   : 모든 div element 선택
$("#name") : element의 id명이 name인 element 선택
$(".name") : element의 class명이 name인 element 선택
$("div, span, p") : 다중선택, 모든 div, p, span element 선택

속성(attribute) 선택

$("a[name=value]")  : element attribute명이 name이고 값이 value인 element 선택
$("a[name^=value]") : element attribute명이 name이고 값이 value값으로 시작하는 element 선택
$("a[name$=value]") : element attribute명이 name이고 값이 value값으로 끝나는 element 선택
$("a[name*=value]") : element attribute명이 name이고 값이 value값을 포함하는 element 선택
$("a[name~=value]") : element attribute명이 name이고 값이 value값을 독립적으로 포함하는 element 선택
$("a[name|=value]") : element attribute명이 name이고 값이 value이거나,
                      값을 독립적으로 포함하는 element 선택
                     ( $("a[name=value]") + $("a[name~=value]") 효과 )

FORM 선택

:button   : <button></button> 혹은 <input type="button"/> element 선택
:checked  : <input type="checkbox"/> element 중 checked="checked"인 element 선택
:disabled : input element중 disabled="disabled" element 선택
:enabled  : input element중 disabled="disabled" 가 아닌 element 선택
:input    : input, textarea, select, button등 모든 element 반환
:checkbox : <input type="checkbox"/> element 선택
:text     : <input type="text" />인 element 선택 
:file     : <input type="file" />인 element 선택
:image    : <input type="image" />인 element 선택 
:password : <input type="password" />인 element 선택 
:radio    : <input type="radio" />인 element 선택 
:selected : SELECT element요소중 option 항목이 "selected"인 element 선택

셈플

$("input[name='nation']").css("background-color","yellow");});
    => <input name="ff nation ddddd" type="text" value="English"> : 선택안됨
$("input[name~='nation']").css("background-color","yellow");});
    => <input name="ff nation ddddd" type="text" value="English"> : 선택됨
$("input[name*='nation']").css("background-color","yellow");});
    => <input name="ffnation ddddd" type="text" value="English"> : 선택됨
$("input[name~='nation']").css("background-color","yellow");});
    => <input name="ffnation ddddd" type="text" value="English"> : 선택안됨

참고

"JavaScript / jQuery" 분류의 다른 글

[jQuery] jQuery.load (0)2014/01/03
[jQuery] DatePicker (0)2013/12/03
2014/01/02 19:55 2014/01/02 19:55
태그 : ,
걸린 글 0 / 덧글 0
글 걸기 주소 : 이 글에는 트랙백을 보낼 수 없습니다

[jQuery] DatePicker

JavaScript/jQuery 2013/12/03 16:44 [39687] 글쓴이 : 나그네

소스코드

 $(function() {
    $( "#datepicker" ).datepicker({
        dayNames : ["일요일", "월요일", "화요일", "수요일", "목요일", "금요일", "토요일"],
        dayNamesMin : ["일", "월", "화", "수", "목", "금", "토"],
        showMonthAfterYear: true,
        nextText: "다음",
        prevText: "이전",
        dateFormat: "yy-mm-dd"
    });
 });

//기본 날짜 지적하기
$('#datepicker').datepicker('setDate', '-7d'    ); //today -7 
$('#datepicker').datepicker('setDate', 'today' ); //today

참고

"JavaScript / jQuery" 분류의 다른 글

[jQuery] jQuery.load (0)2014/01/03
[jQuery] jQuery가 지원하는 셀렉터들 (0)2014/01/02
2013/12/03 16:44 2013/12/03 16:44
태그 : ,
걸린 글 0 / 덧글 0
글 걸기 주소 : 이 글에는 트랙백을 보낼 수 없습니다