Dev Blog

스크립트 & 소스코드 공유

실무에서 유용하게 쓰는 스크립트와 코드 조각을 블로그 게시판으로 저장하고 공유합니다.

JAVASCRIPT|jQuery onclick(this)와 onclick(this.value) 사용법 정리

페이지 정보

조회 179회 작성일 22-02-14 17:02
HTML 태그에서 onclick="함수(this)" 형태로 현재 요소나 값을 전달하는 방법을 정리한 글이다. this로 클릭된 요소 객체 자체를 넘기는 방식과, input 등에서 this.value로 입력된 값만 넘기는 방식의 차이를 예제 코드와 함께 설명하고, 페이지 이동이나 Ajax 실행 시 동적 파라미터를 전달하는 활용법을 소개한다.
<html>
<head>
<script language="javascript">
function test(value){
if(value=='1') {
alert("11111111");
}else{
alert("00000000");
}
}
</script>
</head>

<body>
<form name="form1" method="post" action="">
<input type="radio" name="ra" value="1" onclick="test(this.value)"/>
个人
<input type="radio" name="ra" value="0" onclick="test(this.value)""/>
公司
</form>
</body>
</html>

2.onclick(this)代码详解

一般标签中会使用href和onclick两种方式来进行进行页面跳转或执行动作,但是小编一般都会使用onclick来进行执行Ajax函数进行跳转,并同时使用onclick=”xxxxxx(this)”来传递动态参数:例子如下

JSP代码如下:

<a href="javascript:void(0);"  onclick="xxxx(this)" userId=${userId}>${userName}></a>

JSP代码如下:

function  xxxx(obj) {
var thisObj=$(obj);//js对象转jquery对象
var userId=thsiObj.attr("userId");
alert(userId);
}


Let's create something great together.

프로젝트 문의 및 견적 요청은 언제든 환영합니다.