jQuery - 獲取每篇文章的用戶ID和文章ID

我想將指定的文章保存爲收藏夾。所以我有一個按鈕，它應該獲得該文章的ID和用戶的ID（我將它們存儲到數據庫中）。我試圖做這樣的事情：這是一個刀片...jQuery - 獲取每篇文章的用戶ID和文章ID

@foreach ($results['matches'] as $doc => $docinfo) 
. 
. 
. 
    <button class="bookmark"><img id="favorite" align="right" src="{{ asset('/img/icon_add_fav.png')}}"></button> 
    <input type="hidden" id="{{Auth::user()->id}}" value="{{Auth::user()->id}}"> 
    <input type="hidden" id="{{$docinfo['attrs']['sid']}}" value="{{$docinfo['attrs']['sid']}}"> 
. 
. 
. 
@endforeach

到目前爲止我試着輸出控制檯中的值：

<script type="text/javascript"> 
     $('#favorite').click(function(){ 
      addFavorite(); 
     }); 

     function addFavorite(){ 
      var idUser = document.getElementById({{Auth::user()->id}}).value; 
      var idArticle= document.getElementById({{$docinfo['attrs']['sid']}}).value; 
     console.log(idUser + '#' + idArticle); 
    } 
    </script>

只打印以控制第一篇文章的按鈕是否被點擊。然而，它打印的最後一篇文章的id ...

例如...

<button class="bookmark"> 
    <img id="favorite" align="right" src="http://localhost:8000/img/icon_add_fav.png"> 
    </button> 
    <input type="hidden" id="15" value="15"> 
    <input type="hidden" id="1" value="1"> 

<button class="bookmark"> 
    <img id="favorite" align="right" src="http://localhost:8000/img/icon_add_fav.png"> 
    </button> 
    <input type="hidden" id="15" value="15"> 
    <input type="hidden" id="2" value="2"> 

<button class="bookmark"> 
    <img id="favorite" align="right" src="http://localhost:8000/img/icon_add_fav.png"> 
    </button> 
    <input type="hidden" id="15" value="15"> 
    <input type="hidden" id="3" value="3">

這裏我有三個按鈕。當我按第二和第三個時，沒有任何反應。當我按第一個時，它不打印15#1像它應該，但它打印15#3。

我想打印的ID和文章ID當我點擊相關文章的按鈕...

來源

2017-02-02 harunB10

做這樣的事情綁定點擊button的類bookmark

$(".bookmark").on("click",function(){ 
 
var idUser = $(this).next().val(); 
 
var idArticle = $(this).next().next().val(); 
 
console.log(idUser + "#" + idArticle); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button class="bookmark"> 
 
    <img id="favorite" align="right" src="http://localhost:8000/img/icon_add_fav.png"> 
 
    </button> 
 
    <input type="hidden" id="15" value="15"> 
 
    <input type="hidden" id="1" value="1"> 
 

 
<button class="bookmark"> 
 
    <img id="favorite" align="right" src="http://localhost:8000/img/icon_add_fav.png"> 
 
    </button> 
 
    <input type="hidden" id="15" value="15"> 
 
    <input type="hidden" id="2" value="2"> 
 

 
<button class="bookmark"> 
 
    <img id="favorite" align="right" src="http://localhost:8000/img/icon_add_fav.png"> 
 
    </button> 
 
    <input type="hidden" id="15" value="15"> 
 
    <input type="hidden" id="3" value="3">

來源

2017-02-02 09:57:08 Curiousdev

它的工作原理... Thx – harunB10

@ harunB10請找到更新的答案以及 – Curiousdev

我做了，但犯了一個錯字，認爲它不起作用。現在可以了。對不起，又來了！ – harunB10

-1

只能有一個具有相同id一個元素 - 所有的按鈕具有相同的id。

使用類來代替事件處理程序，然後在事件處理程序中使用this，以便知道哪個按鈕已被按下。

然後，您可以使用DOM導航$(this).next()，使用屬性鏈接它們或將它們分組在父容器中。

使用.next()：

// wire up to the button, not the image 
$('button.bookmark').click(function() { 
    var idUser = $(this).next().val(); 
    var idArticle = $(this).next().next().val(); 
    console.log(idUser + '#' + idArticle); 
});

來源

2017-02-02 09:50:07

錯了， '這' 在addFavourite是不可見的，實際上， '這個' 不點擊該功能按鈕。你需要擴展像這個addFavourite（元素）的功能，當想要調用點擊功能發送此addFavourite（$（this）） –

@NedimHozić你是對的 - 我試圖保持它在相同的格式原來的問題，而不是內聯，並犯了一個小錯誤。這個概念是一樣的：使用'this'。 –

您正在使用的所有圖像標記相同id。這不好。您應該使用class而不是id。

所以你html看起來就像這樣

<button class="bookmark"> 
    <img class="favorite" align="right" src="http://localhost:8000/img/icon_add_fav.png"> 
    </button> 
    <input class="userid" type="hidden" id="125" value="135"> 
    <input class="articleid" type="hidden" id="1" value="1"> 

<button class="bookmark"> 
    <img class="favorite" align="right" src="http://localhost:8000/img/icon_add_fav.png"> 
    </button> 
    <input class="userid" type="hidden" id="135" value="145"> 
    <input class="articleid" type="hidden" id="2" value="2"> 

<button class="bookmark"> 
    <img class="favorite" align="right" src="http://localhost:8000/img/icon_add_fav.png"> 
    </button> 
    <input class="userid" type="hidden" id="165" value="155"> 
    <input class="articleid" type="hidden" id="3" value="3">

和Script

$('.bookmark').click(function(){ 
      var userid=$(this).next('.userid').val(); 
      console.log(userid); 
    });

Working fiddle

來源

2017-02-02 09:54:18 Manoj

但我需要唯一的userId。 'Auth :: user（） - > id'給我當前用戶的id。如果我是用戶，我想將文章添加到收藏夾，那麼它應該只保存我的ID ... – harunB10

也許這個解決方案將幫助你。

function addFavourite(userId, articleId) { 
    console.log(userId + "#" + articleId) 
}

當渲染HTML

@foreach ($results['matches'] as $doc => $docinfo) 
. 
. 
. 
    <button class="bookmark" onClick="addFavourite(Auth::user()->id, $docinfo['attrs']['sid'])" /> 
. 
. 
. 
@endforeach

來源

2017-02-02 10:02:30

jQuery - 獲取每篇文章的用戶ID和文章ID

回答

相關問題