He seguido dos "div" con la etiqueta "ancla" y quiero obtener "atributo" con la función "onclick". Aquí está mi código html
<div class="upvote_dm"> <a class="pr_vote_up '.$clssup.' btnsnew '.$FeedId.'" data-datac="1" data-flagid='.$FeedId.' id=Up'.$FeedId.' data-type="feed" data-datacw='.$UserWalletAddress.' href="#" data-id="10" onclick="return AddFeedVotes()"></a> <span id="UpVoteCount'.$FeedId.'">'.$DefaultUpVotes.'</span> </div> <div class="downvote_dm"> <a class="pr_vote_down '.$clssdown.' btnsnew '.$FeedId.'" data-datac="0" data-status="Down'.$FeedId.'" data-flagid='.$FeedId.' id=Down'.$FeedId.' data-type="feed" data-datacw='.$UserWalletAddress.' href="#" data-id="10" onclick="return AddFeedVotes()"></a> <span id="DownVoteCount'.$FeedId.'">'.$DefaultDownVotes.'</span> </div>
Ahora estoy tratando de obtener el atributo de la siguiente manera, pero me muestra "Undefine", ¿Dónde estoy equivocado?
<script> function AddFeedVotes() { var vote = $(this).data('datac'); var type = $(this).data('type'); var flagid = $(this).data('flagid'); alert(vote); alert(type); alert(flagid); } </script>
Tal vez puedas probar javascript
nativo
document.querySelector("#btn").addEventListener("click", event => { console.log(event.target.dataset.a) })
<button data-a="111111" id="btn">button</button>
No ha vinculado su llamada en línea de la función con el elemento específico y, por lo tanto, no puede hacer referencia a los atributos data
.
Puede agregar un evento de clic usando una nueva clase como lo he hecho a continuación, si agrega .vote
a sus enlaces, luego agregue un evento de clic a todos ellos usando jquery
.
$("a.vote").click( function() { // code goes here });
Deberá distinguir los votos a favor o en contra más adelante en su código, pero podría usar:
if ($(this).hasClass('pr_vote_down')) { // down vote code } else { // up vote code }
// Add click event to all a tags with class vote $("a.vote").click(function() { // No you can use $(this) as you have linked the function to the specific element rather than calling it in the absract. var vote = $(this).data('datac'); var type = $(this).data('type'); var flagid = $(this).data('flagid'); // Check if the clicked link has the down vote class if ($(this).hasClass('pr_vote_down')) { // down vote code alert("down vote"); } else { // up vote code alert("up vote"); } alert(vote); alert(type); alert(flagid); });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="upvote_dm"> <a class="pr_vote_up vote '.$clssup.' btnsnew '.$FeedId.'" data-datac="1" data-flagid='.$FeedId.' id=Up '.$FeedId.' data-type="feed" data-datacw='.$UserWalletAddress.' href="#" data-id="10">Up Vote</a> <span id="UpVoteCount'.$FeedId.'">'.$DefaultUpVotes.'</span> </div> <div class="downvote_dm"> <a class="pr_vote_down vote '.$clssdown.' btnsnew '.$FeedId.'" data-datac="0" data-status="Down'.$FeedId.'" data-flagid='.$FeedId.' id=Down '.$FeedId.' data-type="feed" data-datacw='.$UserWalletAddress.' href="#" data-id="10">Down Vote</a> <span id="DownVoteCount'.$FeedId.'">'.$DefaultDownVotes.'</span> </div>
En su código no agregó nada para una etiqueta.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div class="upvote_dm"> <a id="upVote" class="pr_vote_up '.$clssup.' btnsnew '.$FeedId.'" data-datac="1" data-flagid='.$FeedId.' id=Up'.$FeedId.' data-type="feed" data-datacw='.$UserWalletAddress.' href="#" data-id="10" onclick="return AddFeedVotes()">Up vote</a> <span>'.$DefaultUpVotes.'</span> </div> <div class="downvote_dm"> <a id="downVote" class="pr_vote_down '.$clssdown.' btnsnew '.$FeedId.'" data-datac="0" data-status="Down'.$FeedId.'" data-flagid='.$FeedId.' id=Down'.$FeedId.' data-type="feed" data-datacw='.$UserWalletAddress.' href="#" data-id="10" >Down vote</a> <span >'.$DefaultDownVotes.'</span> </div> </body> </html> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script type="text/javascript"> $('#upVote, #downVote').click(function(event) { var vote = $(this).data('datac'); var type = $(this).data('type'); var flagid = $(this).data('flagid'); alert(vote); alert(type); alert(flagid); }); </script>