2017-12-29 12 views
0

- 내 <a> 태그의 속성을 얻으려고합니다. 아래 예제는 999입니다. 속성 - - 999 - 내 a -tag의 다시 현재 아무 것도 반환하지 않습니다 crypto_idEDIT 버튼을 누르면

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>Jquery Modal</title> 
 
</head> 
 

 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
 

 
<script> 
 
    $(document).ready(function() { 
 
    //display modal form for product EDIT *************************** 
 
    $(document).on('click', '.open_modal', function() { 
 
     var cryptos_id = $(this).val(); 
 
     console.log("cryptos_id: " + cryptos_id) 
 
    }); 
 

 
    }); 
 
</script> 
 

 
<body> 
 
    <div> 
 
    <tr> 
 
     <a id="coo99" value="999" class="open_modal" data-target="#myModal"> 
 
     <sup> EDIT</sup> 
 
     </a> 
 
    </tr> 
 
    </div> 
 

 
    <!-- MODAL SECTION --> 
 
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
 
    <div class="modal-dialog"> 
 
     <div class="modal-content"> 
 
     <div class="modal-header"> 
 
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
 
        <span aria-hidden="true">×</span> 
 
       </button> 
 
      <h4 class="modal-title" id="myModalLabel">Edit</h4> 
 
     </div> 
 
     <div class="modal-body"> 
 
      <form id="frmProducts" name="frmProducts" class="form-horizontal" novalidate=""> 
 
      <div class="form-group error"> 
 
       <label for="inputName" class="col-sm-3 control-label">Name: </label> 
 
       <div class="col-sm-9"> 
 
       <input type="text" class="form-control has-error" id="name" name="name" placeholder="Country of Origin" value=""> 
 
       </div> 
 
      </div> 
 
      </form> 
 
     </div> 
 
     <div class="modal-footer"> 
 
      <button type="button" class="btn btn-primary" id="btn-save" value="update">Edit Entry</button> 
 
      <input type="hidden" id="product_id" name="product_id" value="101"> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 

 
</body> 
 

 
</html>

는, 그러나 나는 value을 좀하고 싶습니다 : 아래에있는 내 최소 가능한 예를 참조하십시오 .

내가 뭘 잘못하고 있다고 생각하니?

+3

.val()은 주로 양식 필드에 사용됩니다. 속성 'value'의 값을 원한다. var cryptos_id = $ (this) .attr ('value'); –

+3

음,'value'는 앵커의 법적 속성이 아닙니다. 그것은 간단합니다. – gforce301

+2

'legal'은 아니지만 유효합니다. @MarouenMhiri가 말했듯이'.attr ('value'); '그것에 도달. – Snowmonkey

답변

4

값은 양식 필드 요소에만 관련됩니다. 대신 데이터 속성을 사용해야 할 것입니다 : 당신은 잘못된 일보고있는

$(document).on('click', '.open_modal', function() { 
 
    var cryptos_id = $(this).data('value'); 
 
    console.log("cryptos_id: " + cryptos_id) 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<a id="coo99" class="open_modal" href="#" data-value="999" data-target="#myModal">Open Modal</a>

+0

* "입력 속성"* 무엇입니까? – charlietfl

+0

죄송합니다. 단지 의견을 말하고 싶습니다. –

+0

figured so ... * "form controls"* 또한 그들에게 유용한 용어입니다 – charlietfl

2

.

$(this).val() 당신이 뭘하고 있는지 알려주지 않으므로 대신 $(this).attr("value")과 같은 것을 사용해야합니다. 속성 "value"에 정의 된 모든 내용을 가져옵니다.

(.val()은 주로 형태로, 즉 input 엔티티와 함께 ​​사용됩니다).

+1

나는이 두려움을 도와주지 않을 것이다. gforce301과 마찬가지로 언급 된 값은 a- 태그에 유효한 속성이 아닙니다. 칼이 제안한 데이터를 사용해야합니다. –

+1

@HansDash 거의 모든 태그에 거의 모든 속성을 넣을 수 있고'attr'을 사용하여'value'를 얻는 것이 특별하지 않습니다. – Musa

+0

@HansDash "유효"하지 않지만 작동합니다. 다른 답변은 왜 "value"속성이 올바르지 않은지에 대해 설명합니다. – Ben