javascript - 如何更改通过点击功能添加的img src？

Question

我想更改变量var ajax_loader = jQuery('<img class="fl-spinner" width="16" heigth="16" src="' + fl_mc_settings.fl_spinner + '" />');外部添加的 _.js，我无法更改、删除等。

jQuery(document).ready(function() {
    jQuery(document).on("click", ".fl_click_switcher a", fl_switch_currency_handler)
});
var fl_switch_currency_handler = function(event) {
    event.preventDefault();
    if (jQuery(this).is(":disabled") || jQuery(this).parent().hasClass("fl-cs-active-currency") || jQuery(this).hasClass("fl-cs-active-currency")) {
        return false
    } else {
        jQuery(this).off(event)
    }
    fl_load_currency(jQuery(this).attr("rel"))
};
function fl_load_currency(currency, force_switch) {
    var ajax_loader = jQuery('<img class="fl-spinner" width="16" heigth="16" src="' + fl_mc_settings.fl_spinner + '" />');
    jQuery(".fl_click_switcher").append(ajax_loader);
    if (typeof force_switch === "undefined")
        force_switch = 0;
    jQuery.ajax({.........

• 有没有办法覆盖上面提到的变量，而不影响其余的原始函数？
• 或者:如何覆盖变量 html 输出 - 如果在 onclick 函数之后添加输出？

谢谢你

Answer 1

最简单的解决方案必须是将 fl_mc_settings.fl_spinner = "new-image.jpg"; 添加到您的脚本中(确保它在 spinner js 之后加载)

有了它，只需覆盖用作微调器的图像

<小时/>

例如

<script src="path-to-spinner.js"></script>
<script>
    fl_mc_settings.fl_spinner = "new-image.jpg";
</script>

<小时/>

根据评论更新

当图像源被注入(inject)到 HTML 片段中时，这里有一个使用 img 的 onload 事件的技巧。

它的作用是将 onload="wrap_img(this);" 注入(inject)到 img 标记中，并且当插入图像并加载图像时，事件触发，然后可以使用 jQuery 的 .wrap() 方法将图像包装在例如一个div。

var fl_spinner = 'http://placehold.it/200x100/" onload="wrap_img(this);"';
var ajax_loader = '<img class="fl-spinner" width="160" heigth="160" src="' + fl_spinner + '" />';

function wrap_img(img) {
  $(img).wrap( "<div class='spinner_wrapper'></div>" );
}

document.body.innerHTML = ajax_loader;

.spinner_wrapper {
  display: inline-block;
  background: red;
  padding: 20px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<小时/>

在你的情况下，它可能看起来像这样

<script src="path-to-spinner.js"></script>
<script>
    fl_mc_settings.fl_spinner = 'new-image.jpg" onload="wrap_img(this);"';

    function wrap_img(img) {
      jQuery(img).wrap( "<div class='spinner_wrapper'></div>" );
    }
</script>
<style>
    .spinner_wrapper {
      display: inline-block;
      background: red;
      padding: 20px;
    }
</style>