까치의 일상노트 까치의 일상노트

프로그래밍/Jquery

• JQuery Method append 추가 메소드

  프로그래밍/Jquery 2019. 9. 28. 17:50

  오늘은 Jquery의 Method append에 대해 알아보겠습니다. append는 '덧붙이다'라는 뜻입니다. 그래서 추가 기능이라고 보시면 되는데요. 뜻과 같이 html에서도 덧붙이기 추가하는 기능으로 구현을 많이 합니다. 구현해보겠습니다. $(document).ready(function(){ var count = 1; $('button').click(function(){ var html = ' 내용을 추가합니다' + count +''; count++; $('#outer').append(html); }); }); 자바스크립트 부분입니다. 카운트 body부분 내용입니다. 클릭과, 클릭 후 결과 화면 append함수를 이용하여 사람인의 이력서 항목 추가나, erp의 작성 내용 추가 버튼 구현이 가능합니다...

  Read More
• Jquery Method click(클릭 메소드를 알아보자)

  프로그래밍/Jquery 2019. 9. 28. 17:36

  오늘은 Jquery의 Method Click에 대해 알아보겠습니다. Jquery는 기본적으로 체인형과 선택자를 가지기 때문에 기본 선택을 한 후 내용을 바꾸거나 값을 가져오는 것이 가능한다. 이 부분을 click으로 구현해 보면서 살펴보겠습니다. $(document).ready(function(){ $('button').click(function(){ $('#outer').removeClass("dn"); }); }); 1. 버튼을 클릭시 라고 해석하며 작성한다. 2. function안에 내용을 작성하며 사용한다. 위에 부분이 jquery의 부분입니다. 나는 클릭 되었습니다. 클릭 html내용입니다. dn은 style -> display: none;입니다. 프로그램을 시작하면 이런 모양이 나오며 버튼을 ..

  Read More
• Jquery 패스워드 중복 체크 기능 구현

  프로그래밍/Jquery 2019. 9. 27. 08:11

  회원가입 폼을 이용한 패스워드 중복 체크 입니다. 패스워드를 이중으로 확인하는 부분을 구현해 봤습니다. 자바스크립트 구현(removeClass, addClass, val() 함수 이용) $("#passwordCheck, #password").on("change", function() { $('#pass_false').addClass( 'dn' ); /*실행하면 텍스트 없앰*/ $('#pass_true').addClass( 'dn' ); var password = $('#password').val(); /* 패스워드와 패스워드 확인 부분 가져오기 */ var passwordcheck = $('#passwordCheck').val(); if(password == passwordcheck) { $('#pass..

  Read More
• Jquery 별점 기능 구현(별점 주기)(removeClass, addClass, attr)

  프로그래밍/Jquery 2019. 9. 26. 21:50

  별점 주기 기능을 살펴보겠습니다. 우선 Jqeury부분을 이렇게 적어 줍니다. #star a{ text-decoration: none; color: gray; } #star a.on{ color: red; } 별점 주기 기능의 원리 첫 번째 줄은, a태그를 클릭하니 부모인 p태그를 선택한 다음 다시 자식들은 모두 선택 해 주어 다 클래스를 삭제를 시킵니다. 두 번째 줄은, 클릭한 것을 일단 클래스를 추가하여 red로 변형해줍니다. 그다음 이전의 것을 모두 대려 오는 배열을 만들고 그것들의 클래스를 추가해주면 나머지 부분도 red색으로 바뀌게 됩니다. $('#star a').click(function(){ $(this).parent().children("a").removeClass("on"); $(this..

  Read More
• Jquery focus()함수

  프로그래밍/Jquery 2019. 9. 26. 08:04

  focus() 함수에 대해 알아보겠습니다. focus 함수는 내가 처리해줄 대상의 값이 다르거나 처음 시작해서 먼저 작성해 주세요라는 표현으로 html 에서 많이 표현 하게 됩니다. 코드를 보시면서 확인해 보시죠. 자바스크립트를 보시고 아래와 같이 작성해 주세요. html 코드를 작성해 이렇게 작성해 주세요. 그럼 아래와 같은 화면이 나옵니다. 로그인 그리고 로그인 버튼을 눌러 주시면 id라는 id값을 가진 input박에서 커서가 들어가 있는 걸 보실 수 있습니다. 밑에는 풀 코드 이니 보시고 활용하세요 로그인

  Read More
• Jqeury val() 함수 (값 바꾸기, 값 가져오기)

  프로그래밍/Jquery 2019. 9. 25. 20:57

  jquery val() 함수에 대해 알아보겠습니다. 말로 설명 필요 없이 바로 사용해보도록 하죠. 오늘은 val()함수로 값을 가져오는 걸 해보겠습니다. $("선택자"). val() 함수를 사용하면 입력한 값이 출력 되게 됩니다. 로그인 와 html소스 입니다 그러면 아래의 그림이 나오게 됩니다. 위에 자바스크립트(jquery)를 작성해 보도록 하죠. $(값을 가져올 선택자). val();를 해주면 이벤트 발생 시 jquery로 값가 져 오기 끝

  Read More