Как я могу получить динамическое значение для моей переменной id в JavaScript? - PullRequest
0 голосов
/ 10 июня 2019

Я пытался получить различные значения в моей переменной id в javascript, чтобы я мог получить данные в соответствии с указанным мной идентификатором.

У меня есть следующий код внутри <script></script>

$(document).ready(function() {
          $('.stambha-img').hide();
            $(".stambha-cat").hover(function() {
            var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value");
                $.ajax({
            url: '/ajaxCat.php',
            type: 'POST',
            data: {
            id: id
            },
            success: function(response){
            if (typeof(response) != 'object') {
              response = $.parseJSON(response);
            }
            if (response.status.status == true) {
              var html_option = ""
              $.each(response.body, function(key, value) {
                var newsImage = "";
                if(value.image === ""){
                    newsImage = "<?php echo FRONT_IMAGES_URL.'shikshak.jpg' ?>";

                } else {
                    newsImage = value.image;
                }
                html_option += "<div class='col-md-3'><div class='stambha-img'><img class='img-responsive' src='" + newsImage + "'></div></div>";
              });
              html_option += "<div>";
              $('#catAjax').html(html_option);
            } else if(response.status.status == false){
                var amount_np = 'hello';
                $('#catAjax').html('<div class="container text-center" id="c404"><div class="row"><div class="col-md-6 col-sm-12 offset-md-3 c404"><h5 style="color:#DB4729"><strong>माफ गर्नुहोस्! यस कोटीमा कुनै समाचार छैन।</strong></h5></div></div></div>');
            }
            }
            });
              $('.stambha-img').show(); 
            }),

        $(".stambha-cat").mouseenter(function() {
               $(".stambha-img").show();
            });
          $(".stambha-cat").mouseleave(function() {
            $(".stambha-img").hide();
            id = "";
          });
        });

Я хочу стереть значение id при возникновении события mouseleave, чтобы при переходе к следующему элементу я мог получить идентификатор другой категории.

И у меня есть следующий кодвнутри списка:

<li class="stambha-cat" value="<?php echo $necessary->id ?>"><a class="boldtitle" href="http://<?php echo $necessary->url ?>" target="_blank"><strong><?php echo $necessary->title ?></strong></a></li>

Обновление: при наведении курсора на другую категорию я получаю тот же идентификатор категории.Это потому, что var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value"); дает значение первой категории внутри класса "stambha-cat"?

1 Ответ

0 голосов
/ 10 июня 2019

Замена var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value"); на var id = $(this).attr('value'); у меня сработала.Смотрите полный код ниже:

$(document).ready(function() {
  $('.stambha-img').hide();
    $(".stambha-cat").hover(function() {
    var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value");
        $.ajax({
    url: '/ajaxCat.php',
    type: 'POST',
    data: {
    id: id
    },
    success: function(response){
    if (typeof(response) != 'object') {
      response = $.parseJSON(response);
    }
    if (response.status.status == true) {
      var html_option = ""
      $.each(response.body, function(key, value) {
        var newsImage = "";
        if(value.image === ""){
            newsImage = "<?php echo FRONT_IMAGES_URL.'shikshak.jpg' ?>";

        } else {
            newsImage = value.image;
        }
        html_option += "<div class='col-md-3'><div class='stambha-img'><img class='img-responsive' src='" + newsImage + "'></div></div>";
      });
      html_option += "<div>";
      $('#catAjax').html(html_option);
    } else if(response.status.status == false){
        var amount_np = 'hello';
        $('#catAjax').html('<div class="container text-center" id="c404"><div class="row"><div class="col-md-6 col-sm-12 offset-md-3 c404"><h5 style="color:#DB4729"><strong>माफ गर्नुहोस्! यस कोटीमा कुनै समाचार छैन।</strong></h5></div></div></div>');
    }
    }
    });
      $('.stambha-img').show(); 
    }),

$(".stambha-cat").mouseenter(function() {
       $(".stambha-img").show();
    });
  $(".stambha-cat").mouseleave(function() {
    $(".stambha-img").hide();
    id = "";
  });
});
...