使用图像而不是文本(script type=“text/javascript”)

Use an image instead of text (script type="text/javascript")

本文关键字:text javascript type script 图像 文本      更新时间:2023-09-26

我有一些供应商提供的代码:

<a class="sh_lead_button" href="https://107617.17hats.com/p#/lcf/sfrnrskrvhcncwvnrtwwvhxvzkrvzhsd" onclick="shLeadFormPopup.openForm(event)">FREE Puppies</a>
<script type="text/javascript" src="https://107617.17hats.com/embed/lead/script/sfrnrskrvhcncwvnrtwwvhxvzkrvzhsd"></script>

我想用图像替换FREE Puppies文本。 供应商说这做不到,但我不同意。 我已经尝试了几种不同的东西,但似乎没有什么工作是完全正确的。 我真的很感激一些帮助。 我知道我只是错过了一些小东西。 非常感谢!

仅用图像替换文本是行不通的,因为嵌入的脚本会查找单击元素的 href 属性 ( event.target )。对于链接标记中的图像,目标元素是图像,并且没有href属性。

要解决此问题,您可以在这些链接内的任何图像上捕获事件,阻止它,并模拟对父链接的单击。

不使用 jQuery 的演示

var sh_lead_images = document.querySelectorAll('.sh_lead_button img');
for(var i=0; i<sh_lead_images.length; i++)
{
    sh_lead_images[i].addEventListener('click', function(e){
        e.stopPropagation();
        e.preventDefault();
        this.parentNode.click();
    });
}
<a class="sh_lead_button" href="https://107617.17hats.com/p#/lcf/sfrnrskrvhcncwvnrtwwvhxvzkrvzhsd" onclick="shLeadFormPopup.openForm(event)">
  <img src="http://www.truthunity.net/sites/all/content/graphics/ministry-click-me-button.jpg" alt="">
</a>
<script type="text/javascript" src="https://107617.17hats.com/embed/lead/script/sfrnrskrvhcncwvnrtwwvhxvzkrvzhsd"></script>

使用 jQuery 的演示

$('.sh_lead_button img').click(function(e){
    e.stopPropagation();
    e.preventDefault();
    $(this).parent().click();
});
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>
<a class="sh_lead_button" href="https://107617.17hats.com/p#/lcf/sfrnrskrvhcncwvnrtwwvhxvzkrvzhsd" onclick="shLeadFormPopup.openForm(event)">
  <img src="http://www.truthunity.net/sites/all/content/graphics/ministry-click-me-button.jpg" alt="">
</a>
<script type="text/javascript" src="https://107617.17hats.com/embed/lead/script/sfrnrskrvhcncwvnrtwwvhxvzkrvzhsd"></script>

如果您能够更改源 html,您应该可以轻松放置图像标签。

<a class="sh_lead_button" href="https://107617.17hats.com/p#/lcf/sfrnrskrvhcncwvnrtwwvhxvzkrvzhsd" onclick="shLeadFormPopup.openForm(event)">
    <img src="wherever-you-have-your-image.png">
</a>
<script type="text/javascript" src="https://107617.17hats.com/embed/lead/script/sfrnrskrvhcncwvnrtwwvhxvzkrvzhsd"></script>

问候

F.

您可以将标签放置和图像到标签中。喜欢这个:

<a class="sh_lead_button" href="http://www.google.es" target="_blank">
    <img src="https://www.gravatar.com/avatar/7c4c20b9134504e04754d751aa7f90c1?s=48&d=identicon&r=PG&f=1" >
</a>

原始问题上没有提到嵌入式脚本。