본문 바로가기

jQuery17

textarea값을 p태그로 옮기기 textarea값을 p태그로 옮기기 $("#textAreaId").keyup(function() { //textArea에서 문자입력시 var contents = $("#textArea").val().replace(/\n/g," "); // textArea에 있는 줄바꿈문자를 br태그로 변경 $("#pId").html(contents); // p태그에 입력 });); 2017. 3. 20.
html checkBox 전체 선택 및 해제 제이쿼리(jQuery)로 html checkBox 전체 선택 및 해제 전체선택을 하는 checkBox의 html id가 필요하고그 외의 checkBox의 html id의 규칙이 필요하다. // html id가 "chkAll"이라는 엘리먼트를 클릭시$("#chkAll").click(function(){ // 해당 체크박스의 checked 값이 true 이면 if( $(this).is(":checked") ){ // html id가 "chk_"으로 시작하는 모든 체크박스의 checked 값을 true로 변경한다. $("input[id^=chk_]:checkbox:not(:disabled)").prop("checked", true); } else { // html id가 "chk_"으로 시작하는 모든 체크박스.. 2017. 3. 19.
html selected 변경 및 change 실행 html select box의 selected 값을 강제로 스크립트를 통해서 변경해주는 방법 jquery를 이용하면 두 줄이면 충분하다. 1010 2020 3030 $("#select_id").val("30").prop("selected", true); 해석 : html의 id값이 "select_id"를 찾고,value 값이 "30"인 것을 찾고,"selected"의 property를 true로 변경한다. $("#select_id").trigger("change");해석 : html의 id값이 "select_id"를 찾아서, "change" 이벤트를 실행시킨다. 이렇게 두 줄을 쓰면, select 값을 변경해주면서, change 이벤트까지 실행시킬 수 있다. $("#select_id").val("30").. 2016. 6. 21.
jQuery 클릭 이벤트 jQuery 클릭 이벤트는 두가지가 있습니다. $(document).ready(function(){ $("#test01").click(function() { // 1번째 alert(this.id); }); $("body").on("click", "[id=test02]", function(event) { // 2번째 alert(this.id); }); }); 1번째와 2번째는 기능적으로 같지만, 차이점이 하나 있습니다. html이 이미 로딩(최초 로딩)이 되고 나서 새로운 html 영역을 jquery나 다른 방법으로 생성하게 되면 1번째 이벤트는 먹히지 않습니다. 최초 로딩할 때는 id가 "test01"인 곳이 없었기 때문이죠. 하지만, 새로운 html이 생성되더라도 2번째 이벤트는 먹힙니다. 왜냐면 bo.. 2016. 5. 9.