JS Передача значение href в js код

Question

Помогите с кодом пожалуйста. Как сделать передачу значения из a href по нажатие - в сам код JS То есть при нажатие на ссылку, данные href="xxx" попадают в код JS

Пример моего кода:

$(document).ready(function() {

    var itemID = '000'; // <-- Неообходимо, что бы здесь менялось значение после клина по ссылке
    var jsonlink = 'https://mysite.com/pages/+'itemID'+.json';


        $.getJSON(jsonlink, function(data) {


            $('#id').html(data.id);
            $('#title').html(data.title);
            $('#desc').html(data.content);

        });
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div> <a href="#itemID111">Item ID 111 </a> </div>
<div> <a href="#itemID222">Item ID 222 </a> </div>
<div> <a href="#itemID333">Item ID 333 </a> </div>

<hr>

<!-- Вывод контента из JSON -->
  <div class="fw-600">TEST PAGE</div>
  <div>
    <span>ID |</span>
    <span id="id">status</span>
  </div>
  <div>
    <span>Title |</span>
    <span id="title">status</span>
  </div>
  <div>
    <span>Desc |</span>
    <span id="desc">status</span>
  </div>

Мне необходимо вытаскивать данные из JSON.

Answer 1

Используйте data- атрибуты для того, чтобы держать нужные данные, а не что-то пытаться сделать с href

$(document).on('click', '.item', function(e) {
    e.preventDefault();
    let itemId = $(this).data().id;
    console.log(itemId);
    
    let jsonlink = 'https://mysite.com/pages/' + itemId + '.json';

//    $.getJSON(jsonlink, function(data) {
//        $('#id').html(data.id);
//        $('#title').html(data.title);
//        $('#desc').html(data.content);
//    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div> <a href="#itemID111" class="item" data-id="111">Item ID 111 </a> </div>
<div> <a href="#itemID222" class="item" data-id="222">Item ID 222 </a> </div>
<div> <a href="#itemID333" class="item" data-id="333">Item ID 333 </a> </div>

<hr>

<!-- Вывод контента из JSON -->
<div class="fw-600">TEST PAGE</div>
<div>
  <span>ID |</span>
  <span id="id">status</span>
</div>
<div>
  <span>Title |</span>
  <span id="title">status</span>
</div>
<div>
  <span>Desc |</span>
  <span id="desc">status</span>
</div>

БЛОГ НА HUSL

JS Передача значение href в js код

Ответы (1 шт):