Web/JQuery
-
[jQuery] jQuery ajax사용방법Web/JQuery 2019. 8. 7. 15:43
ajax 사용방법 html 읽기 $('#bt').click(function(){//ajax 버튼 클릭 $.ajax({ //--응답페이지 요청이 필수 url: 'getData3.jsp'//요청 , success: function(result){ $('div').html(result); }// 성공시 콜백 //-- 데이터 전달 키, 벨류 , data: { name: $('[name=username]').val() , age: $('[name=age]').val() } , type:'POST' //HTTP요청방식 , dateType: 'html'//응답데이터 형식(text, html, xml, json) , error: function(xhr,status){//에러콜백 alert('서버에러!'); alert(..
-
[jQuery] 새로운 엘리먼트에 이벤트 부여 (부모, 자식 click이벤트)Web/JQuery 2019. 8. 5. 15:05
만약 버튼 클릭시 새로운 버튼을 생성하고, 새로 생성한 버튼에 이벤트를 부여할때 //$('부모선택자').on('click','자식선택자' function(){}); $('div').on('click','#hideBtn', function(){ $('p').hide(1000); }); $('부모선택자').on('click','자식선택자' function(){}); 처음 페이지 로딩된 이후에 버튼이 새로 생성된다면 스크립트에서는 그 버튼의 존재를 모른다. 찾을수 있는 방법은 버튼을 새로 생성한 태그 (div, p, body 등등) 를 부모선택자로 새로 생성한 버튼을 자식선택자로 function을 만들면 된다.
-
[jQuery] selector 사용법, 이벤트 정리Web/JQuery 2019. 8. 5. 13:09
jQuery selector selector selector가 가르키는 의미 $("*") 모든태그 전부다 $(this) 클릭한 태그 $("p.intro") p태그의 클래스가 intro 인것 $("p:first") p태그중 첫번째 $("ul li:first") ul태그 안의 li태그의 첫번째 (부모 자식) $("ul li:first-child") ul태그들의 li태그의 첫번째 모든 자식들 $("[href]") 현재 href속성이 있는 엘리먼트 들 $("a[target='_blank']") a태그의 target속성이 _blank인 것 $("a[target!='_blank']") a태그의 target속성이 _blank가 아닌것 $(":button") button과 input타입의 버튼 둘다 조회가능 $("tr..
-
[jQuery] 제이쿼리 글 숨기기 보이기 (hide, show)Web/JQuery 2019. 8. 5. 11:02
$('#b1').click(function(){ $('p').hide(1000); }); $('#b2').click(function(){ $('p').show(1000); }); $('#b3').click(function(){ $('*').hide(1000); }); #는 태그의 아이디명 hide(숫자), show(숫자) 에서 숫자는 밀리세컨드로 초를 나타낸다. 천천히 사라지거나 천천히 나타난다. *은 모든 태그를 말한다. this는 이벤트를 발생시킨 태그이다.