Блог

Главная - Вопросы по программированию - Создайте динамическую ссылку href внутри jquery

Создайте динамическую ссылку href внутри jquery

#jquery

#jquery

Вопрос:

Я пытаюсь создать динамическую ссылку href внутри jquery, но не могу этого сделать. Я могу получить data-id переменную в jquery, но я не могу понять, как создать ссылку. Кто-нибудь может сказать мне, что я делаю не так?

Я пытаюсь добиться этого:

 <a href="page.php?page_id=some_page_id>"Read More</a>

Мой html

     <a class="fancybox" class="img-responsive" data-id="<?php echo $page_id ?>" id="single_image" href="uploads/<?php echo $file ?>" title="<?php echo $title ?>" width="800 ">
<img src="uploads/thumbnails/<?php echo $file ?>" id="<?php echo $file ?>" class="img-responsive" width="190"></a>

Jquery

 $(document).ready(function() {
$("a#single_image").fancybox({
 afterLoad: function() {
    this.outer.append("<div>"   document.getElementById("detail").innerHTML   "<a href="page.php?page_id="  $(this.element).data('id')   "Read More</a></div>");
  }
});

});

Комментарии:

1. Спасибо, что приняли мой ответ, можете ли вы также проголосовать для дальнейшего использования?

Ответ №1:

Вы неправильно экранируете внутренние кавычки. Попробуйте это:

 this.outer.append("<div>"   document.getElementById("detail").innerHTML   "<a href="page.php?page_id=""  $(this.element).data('id')   "Read More</a></div>");

Комментарии:

1. Спасибо за это. По какой-то причине я не получаю ссылку. Если ввести «href» в строку, я могу видеть это в строке, но как только я добавлю » Есть идеи?

2. @JulianJ я не совсем понимаю ваш пример. Не могли бы вы объяснить это немного более понятно? 🙂

3. Ну, по какой-то причине, когда я экранирую внутренние кавычки, как вы сказали, я не вижу выведенную ссылку. Я поэкспериментировал и обнаружил, что если я опущу ‘<‘ из » Я не могу понять, почему это может вызвать проблему.

4. @JulianJ зачем вам нужно добавлять ‘<‘ в href? href является атрибутом тега привязки HTML a . И ‘<‘ является допустимым префиксом только для html-тегов, а не для атрибутов. Это недопустимый html: <href="google.com"> он должен быть <a href="google.com">

5. Вы совершенно правы. Спасибо, что заметили это. В итоге я получил: this.outer.append(«<div>» document.getElementById(«detail»).innerHTML «»»>Подробнее</a></div>»);

Ответ №2:

Используйте single quote внутри double для 'page.php?page_id='

Замените этот код jquery своим.

 $(document).ready(function() {
   $("a#single_image").fancybox({
     afterLoad: function() {
       this.outer.append("<div>"   document.getElementById("detail").innerHTML   "<a href='page.php?page_id='" $(this.element).data('id')   "Read More</a></div>");
     }
   });
});