Получение значения JS из HTML

Question

Так в основном Im своего рода likeing системы на постах я пытаюсь создать единый сценарий JS, который будет обрабатывать подобные через AJAX До сих пор я сделал это

$(document).ready(
    function() {  
    $("#like").click(function(){ 

     var post_id = document.getElementById(this).value; 

     $.ajax({ 
      url: 'Js_returns/status_like.php', 
      type: 'post', 
      data: {"data" : JSON.stringify(post_id)}, 
      success: function(data) { 
       $("#status_like_" + post_id).append(data); 
      } 
     }); 
    }); 
}); 

И это моя кнопка

<div id="like" value="', $status['postid'] ,'"> 
<i class="fa fa-thumbs-up"></i> 
<i id="status_like_', $status['postid'] ,'">',$status['like_count'],'</i> 
</div> 

Im «Like» своего рода новый для JS поэтому, пожалуйста, не глупые комментарии так вот пока что им стремится к

Когда пользователь нажимает кнопку, JS получает значение div id (например; 1) Затем это значение передается в файл PHP с помощью метода POST После этого, я знаю, как его код (им очень хорошо в PHP, так что вам не нужно объяснять, что часть)

Btw, при использовании этого, Я получаю эту ошибку бРАУЗЕРА

Uncaught TypeError: Cannot read property 'value' of null 

Answer 1

Ваша "ошибка браузера из-за ссылки на value на null -объекте, поскольку document.getElementById() должен иметь идентификатор в качестве параметра, а не DOM элемента. Изменить эту строку в (но см ниже редактирования):

var post_id = document.getElementById(this.id).value; 

Или проще, с помощью JQuery:

var post_id = $(this).val(); 

---

Edit: а rekire отметил в комментарии, div не имеет value атрибут. Вы можете поместить идентификатор в атрибуте id и использовать class связать обработчик OnClick:

PHP:

echo '<div id="like_' . $status['postid'] . '" class="like">'; 

Javascript (в готовом-функции, так как вы в настоящее время есть):

$(".like").click(function(){ 
    var post_id = $(this).attr('id').substr(5); 
    ... 

Это значение будет иметь значение атрибута id div. like_ -part существует, так что идентификатор будет уникальным в html (используя только число может привести к столкновениям). После получения идентификатора элемента используйте substr, чтобы удалить like_ -part.

Answer 2

если я прочитал ваш пост правильно у просто хочет значение #like DIV

<div id="like" value="', $status['postid'] ,'"> 

предполагающего значение устанавливается, так как страница отображается на стороне сервера.С вашей помощью JQuery уже, это все, что вам нужно сделать:

$("#like").click(function(){ 

    var post_id = $(this).attr('value'); 

    $.ajax({ 
     url: 'Js_returns/status_like.php', 
     type: 'post', 
     data: {"data" : JSON.stringify(post_id)}, 
     success: function(data) { 
      $("#status_like_" + post_id).append(data); 
     } 
    }); 
}); 

https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById

Это ниже не работает, getElementById ожидает строку, ссылающийся на Id, Вот почему она возвращает Null, и вы можете «т получить значение нуль

var post_id = document.getElementById(this).value; 

надеюсь, что это помогает ...

Answer 3

ваш следующий код содержит, (запятая) !!!! что неправильно ..

<div id="like" value="', $status['postid'] ,'"> 
<i class="fa fa-thumbs-up"></i> 
<i id="status_like_', $status['postid'] ,'">',$status['like_count'],'</i> 
</div> 

должно быть следующим:

<div id="like" value="<?php echo $status['postid']; ?>"> 
     <i class="fa fa-thumbs-up"></i> 
     <i id="status_like_'<?php echo $status['postid']; ?>'"><?php echo $status['like_count']; ?></i> 
    </div> 

, как я предполагаю, что вы используете JQuery вы можете получить идентификатор сообщения следующим образом:

var post_id = $(this).val(); 

Answer 4

Ваш " ошибка браузера "связана с ссылкой на значение для нулевого объекта, поскольку document.getElementById() должен иметь идентификатор как параметр, а не элемент DOM. Изменить эту строку в (но см правку ниже):

var post_id = document.getElementById(this.id).value; 
Or easier, using JQuery: 

var post_id = $(this).val(); 

Edit: а rekire отметил в комментарии, DIV не имеет значения атрибута. Вы можете поместить идентификатор в атрибуте ид и использовать класс, чтобы связать обработчик OnClick:

PHP:

echo '<div id="like_' . $status['postid'] . '" class="like">'; 

Javascript (в готовом-функции, так как вы в настоящее время есть):

$(".like").click(function(){ 
    var post_id = $(this).attr('id').substr(5); 
    ... 

Получится значение атрибута id div. Подобная_-часть существует, так что идентификатор будет уникальным в html (использование только числа может привести к столкновениям). Получив идентификатор элемента, используйте substr для удаления подобной части.

Marten Большое спасибо!