Извлечение Src и вставить перед HTML-ссылку с помощью JQuery

0

Я пытаюсь извлечь src из img, а затем вставить src в "href", чтобы обернуть вокруг оригинала img

У меня две версии, с которыми я столкнулся и не могу работать. Я думаю, что одна из моих проблем, похоже, вставляет "a href" до или вокруг элемента.

<script type="text/javascript">
  var x = hdnImg.children('img').attr('src') 

  $( "img" ).wrap(function() {
  return "<a href='" +x+ "' class="anyclass"></a>";
    });
</script>

или

<script type="text/javascript">
  var p = hdnImg.children('img').attr('src')

  $( "img" ).before( "<a href='#' class="anyclass">" );
  $( "img" ).after( "</a>" );
</script>

в конечном счете, это было то, что я пытаюсь найти:

html перед скриптом:

    <img src="http://a.jpg">
    <img src="http://b.jpg">

html после скрипта

    <a hre="http://a.jpg" class="classy"><img src="http://a.jpg"></a>
    <a hre="http://b.jpg" class="classy"><img src="http://b.jpg"></a>

Я все еще изучаю javascript и могу использовать небольшое руководство. благодаря

Теги:

5 ответов

1
Лучший ответ

Попробуй использовать

$( "img" ).each(function() {
    var x = $(this).attr('src'); 
    $(this).wrap( "<a href='" +x+ "' class='anyclass'></a>");
});
Поделиться
  • 0
    идеальный. когда нужно начинать это с $ (document) .ready (function () {
  • 1
    Вы захотите поместить его в $ (document) .ready (function () {}); чтобы убедиться, что элементы img существуют, прежде чем оборачивать их.
Показать ещё 2 комментария
1 
$('img').each(function(index,ele) {
    $(this).wrap('<a href="' + $(ele).attr('src') + '" class="classy"></a>');
});

http://jsfiddle.net/AWeAu/

Поделиться
0

возможно, это может вам помочь.

$("img").addClass("classy");
$("img").html('<img src="http://b.jpg">');
Поделиться
0

Попробуйте это, это поможет вам

HTML

 <img src="http://a.jpg">
    <img src="http://b.jpg">
        <div></div>
        <input type='button' value='Click Me'/>

JS

$('input[type=button]').click(function(){
    $('img').each(function(){
        var item='New: <a href='+$(this).prop('src')+' class="classy"><img src='+$(this).prop('src')+' ></a>';
    $(this).remove();
    $('div').append(item);
    });
});

Fiddle Here

Поделиться
0 
<div class="images">
   <span><img src="http://a.jpg"></span>
   <span><img src="http://b.jpg"></span>
</div>

Используйте следующий скрипт:

 $(document).ready(function () {
        $('.images img').each(function () {

            var link = "<a href='" + $(this).attr("src") + "'>" + $(this).closest('span').html() + "</a>";
            $(this).closest('span').html(link);
        });
    });
Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню