2016-10-03 3 views
2

나는 다음과 같은 코드가 함께 발() 대신 속성을 가지고 가십시오 :사용자 정의 jQuery를

<html> 
<head> 
    <script src="http://code.jquery.com/jquery-latest.pack.js"></script> 
</head> 
<body> 
<select name="size"> 
    <option custAttr="0" value="0" disabled selected>Value ↓</option> 
    <option custAttr="10" value="10">AAA (10)</option> 
    <option custAttr="20" value="20">BBB (20)</option> 
    <option custAttr="30" value="30">CCC (30)</option> 
</select> 

<label class="result"></label> 

<script> 
$(document).ready(function() { 
    $('select').on('change', function() { 
     $('.result').text(
      $('select[name=size]').val() 
     ); 
    }); 
}); 
</script> 
</body> 
</html> 

가 실제로 스크립트가 value=""에서 콘텐츠를 걸립니다. 스크립트가 내 사용자 정의 속성 custAttr=""에서 코드를 가져 오는 방법이 있습니까?

+1

'.attr()'을보세요. –

답변

5

먼저 자신의 속성을 만드는 것은 예기치 않은 영향을 줄 수있는 HTML이 유효하지 않음을 의미합니다. 자신의 데이터를 저장하려면 data-* 속성을 사용하십시오. 거기에서 option:selected을 사용하여 필요한 데이터 값을 얻을 수 있습니다. 이 시도 :

$(document).ready(function() { 
 
    $('select').on('change', function() { 
 
    $('.result').text($('select[name=size] option:selected').data('cust-attr')); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select name="size"> 
 
    <option data-cust-attr="0" value="0" disabled selected>Value ↓</option> 
 
    <option data-cust-attr="10" value="10">AAA (10)</option> 
 
    <option data-cust-attr="20" value="20">BBB (20)</option> 
 
    <option data-cust-attr="30" value="30">CCC (30)</option> 
 
</select> 
 

 
<label class="result"></label>

+0

감사합니다. 효과가 있습니다. 동의하려면 5 분을 기다려야합니다. – David

+0

괜찮습니다. 기꺼이 도와 드리겠습니다. –

+0

작은 질문 : 점을 쉼표로 바꾸는 방법을 알고 계십니까? 예 : '123.45' 대신'123,45'입니다. – David

1

을 내가 아는 당신이 트릭을 할해야이

$("#myselect option:selected").attr('custAttr'); 
1
$('select[name=size]').attr("custAttr"); 

.attr()

1

attr()처럼 그것을 할 수 있습니다!

$('select[name=size]').attr('custAttr'); 
관련 문제