JavaScript (63) 썸네일형 리스트형 button 클릭시 페이지가 새로고침될때, preventDefault() button의 기본 동작인 폼 전송(form submission)으로 인해 발생할 수 있다. JavaScript에서 event.preventDefault()를 사용하하면 버튼의 기본동작을 막을 수 있다. event.preventDefault() checkbox value가 submit되지않을때 checkbox는 radio와 다르게 값을 hidden한 input으로 넘겨줘야한다는 사실을 놀랍게도 몇개월에 한번씩 계속 잊고 왜 안되는지 한참을 고민하다 떠올리곤 탄식하는 일이 반복되자.. 반성을 할겸 적어보기로 했다. hidden type input을 추가 onchange시 함수호출 웹 모바일 //checkbox가 선택되었을때 value을 변경한다. function ifCheckedTurnYorN(checkbox, hiddenInputName) { $("input[name='" + hiddenInputName + "']").val(checkbox.checked ? 'Y' : 'N'); } 완료. AJAX, include한 코드에 속성추가하기 아래와 같이 불러온 form에 속성을 추가해보자. $.get('action될 url', function(){ [ $(".contentsFormInclude").html($(data).find("form[name='contentsform']")); }).fail(function(xhr, status, error) { console.error("Error:", error); }); https://standout.tistory.com/797 .attr()로 추가후 원하는방향으로 function을 따로 작성한다, 아래 handleFormSubmit는 예시 $("form[name='contentsform']").attr("onsubmit", "return handleFormSubmit(this);"); funct.. AJAX, 특정영역만 불러오기 .contentsFormInclude안에 특정 파일을 include하되 모든코드말고 특정 영역만 불러와보자. include하는 파일안에 form태그의 name이 contentsform인 영역이 있다고 가정한다면 불러오는 코드 $(".contentsFormInclude").html($(data).find("form[name='contentsform']")); 예시코드 $.get('action될 url', function(){ [ $(".contentsFormInclude").html($(data).find("form[name='contentsform']")); }).fail(function(xhr, status, error) { console.error("Error:", error); }); AJAX, <script> 코드 추가하기 스크립트 추가 $("").text(`cid = 123;`).appendTo(document.head); 변수값으로 추가할경우 $("").text(`cid = ${noValue};`).appendTo(document.head); AJAX, style.css 추가하기 하나씩 추가하는 코드 $("head").append(''); 여러개일 경우 [ '', '' ].forEach(css => $("head").append(css)); 예시코드 $.get('action될 url', function(){ [ '', '' ].forEach(css => $("head").append(css)); }).fail(function(xhr, status, error) { console.error("Error:", error); }); https://standout.tistory.com/794 AJAX, script.js 추가하기 하나씩 추가하는 코드 $.getScript("script.js"); 여러개일 경우 [ '$.getScript("script1.js")', '$.getScript.. AJAX, script.js 추가하기 하나씩 추가하는 코드 $.getScript("script.js"); 여러개일 경우 [ '$.getScript("script1.js")', '$.getScript("script2.js")' ].forEach(script => $.getScript(script)); 예시코드 $.get('action될 url', function(){ [ '$.getScript("script.js")', '$.getScript("script.js")' ].forEach(script => $.getScript(script)); }).fail(function(xhr, status, error) { console.error("Error:", error); }); AJAX 메서드, 비동기적 서버통신 $.get fail $.get('action될 url', function(){ }).fail(function(xhr, status, error) { console.error("Error:", error); }); fail() AJAX 요청이 실패했을때 실행할 콜백 함수 xhr은 XMLHttpRequest 객체를 나타내며, status는 요청 상태 코드를, error는 에러 메시지를 포함한다. 이전 1 2 3 4 5 6 ··· 8 다음
