получить src ребенка Изображение

Question

У меня есть тег img внутри тега a. Если я навещу тег, то я хочу предупредить src тега img и удалить последние 4 его символа.

HTML:

<a onmouseover="hoverImage($(this))"> 
    <img src="https://www.google.de/images/srpr/logo11w.png" height="24" alt="" title="" /> 
    <p>Startseite</p> 
</a> 

JavaScript:

function hoverImage (e) { 
alert(e.find('img').getAttribute('src')); 
} 

Я старался изо всех сил, но не работает :(

http://jsfiddle.net/opvryy00/

Answer 1

попробовать этот

HTML

<a > 
    <img src="https://www.google.de/images/srpr/logo11w.png" height="24" alt="" title="" /> 
    <p>Startseite</p> 
</a> 

JS

$("a").mouseover(function() { 
    var src=$(this).find("img").prop('src'); 
    src=src.slice(0,-4); 
    alert(src) 
}); 

jsfiddle

Answer 2

Не использовать встроенный JavaScript: это действительно некрасиво и устарели, так что вы можете сделать все, что вы хотите с помощью сценария.

Удалите атрибут onmouseover="..." в HTML, добавить идентификатор к вашей ссылке и использовать Javascript для прослушивания события, как это:

HTML:

<a id="my-link"> 
    <img src="https://www.google.de/images/srpr/logo11w.png" height="24" alt="" title="" /> 
    <p>Startseite</p> 
</a> 

Javascript:

function hoverImage(e) { 
    var img = $(e.target).find('img'); 
    alert(img.getAttribute('src')); 

    // Delete the last 4 characters 
    img.setAttribute('src', el.getAttribute('src').slice(0, -4)); 
} 

$("#my-link").mouseover(hoverImage); 

Answer 3

Попробуйте следующее:

$('a').mouseover(function(){ 
    alert($(this).find('img').attr('src').slice(0, -4)); 
}); 

Answer 4

Попробуйте этот код. Вы можете удалить атрибут onmouseover внутри тега.

HTML

<a> 
    <img src="https://www.google.de/images/srpr/logo11w.png" height="24" alt="" title="" /> 
    <p>Startseite</p> 
</a> 

JS

$(function() 
{ 
    $('a').mouseover(function(){ 
    var str = $(this).find('img').attr('src');    
     var new_str = str.substring(0,str.length - 4); 
     alert(new_str); 
    });  
}); 

Answer 5

Я рекомендую вам адаптировать ваш подход немного, давайте удалить встроенный яваскрипт и предназначаться изображение непосредственно. Кроме того, позволяет избежать предупреждения, вы можете увидеть, что результат отображается ниже вашего якоря.

HTML

<a> 
    <img src="https://www.google.de/images/srpr/logo11w.png" height="24" alt="" title="" /> 
    <p>Startseite</p> 
</a> 
<div class="output"></div> 

JS

var hoverImage = function(e) { 
    var $img = $(e.currentTarget), 
     src = $img.attr('src'), 
     newSource; 

    newSource = src.substring(0, src.length - 4); 

    $('.output').html(newSource); 
} 

$(document).on('ready', function() { 
    $('img').hover(hoverImage); 
}); 

http://jsfiddle.net/_naz/u2f2qeaw/