簡體   English   中英

jQuery .replaceWith不起作用

[英]jQuery .replaceWith Not Working

Google Blogger使用javascript將管理員的quickedit圖標放置在小部件或可編輯區域上。

這是HTML:

<a class="quickedit" href="xxxxxx" onclick="return _WidgetManager._PopupConfig(document.getElementById(&quot;BlogArchive1&quot;));" target="configBlogArchive1" title="Edit">
<img alt="" height="18" src="http://img1.blogblog.com/img/icon18_wrench_allbkg.png" width="18">
</a>

我正在嘗試用“真棒字體”圖標替換該圖像。 這是我使用的jQuery:

$('a.quickedit img').replaceWith('<i class="icon-wrench"></i>');

原始映像仍然存在,console.log中沒有相關的錯誤,那么為什么它不起作用? 順便說一句,我正在使用$(document).ready函數和版本1.7.1。

編輯:我還注意到,使用此方法會破壞頁面上所有其他jQuery腳本。 因此可能存在沖突。

這里是沒有我要添加的腳本的所有內容:

<script type='text/javascript'>
  $(document).ready(function() {
    $(&quot;.menu-toggle&quot;).click(function (e) {
        $(this).next(&#39;ul&#39;).slideToggle(&quot;fast&quot;);
    });
    $(&quot;#LinkList1 ul li&quot;).click(function (e) {
        $(this).find(&#39;ul&#39;).slideToggle(&quot;fast&quot;);
    });
    $(&quot;body a, .camera_prev, .camera_next, .camera_pag li&quot;).hover(function(){
        link_audio.play();
    },
    function(){
        link_audio.load();
    });
    $(window).scroll(function(){
        if ($(this).scrollTop() &gt; 100) {
            $(&#39;.scrollup&#39;).fadeIn();
        } 
        else {
            $(&#39;.scrollup&#39;).fadeOut();
        }
    }); 
    $(&#39;.scrollup&#39;).click(function(){
        $(&quot;html, body&quot;).animate({ scrollTop: 0 }, 600);
        return false;
    });
  });
</script>

再次編輯 :無論我如何嘗試,似乎所有其他腳本都中斷了,並且不再起作用,沒有視覺錯誤或console.log中的錯誤。 在此處查看有問題的模板/網站: http : //xarpixels-revitalize-template.blogspot.com/

僅供參考,只有管理員才能看到.quickedit圖標。

您可以嘗試其他方法。 像這樣 :

$('a.quickedit img').after('<i class="icon-wrench"></i>').remove();

希望這可以幫助..

由於我沒有完全理解需求,但是在其他人的理解下,我已經修復了代碼,請看一下

小提琴演示

更改CSS和JS代碼

$('a.quickedit').append('<i class="icon-wrench"></i>');

標記為正確,如果它解決了您的問題

將此添加到您的CSS類中。 您需要它,因為標記i是內聯HTML元素。 看看這個http://jsfiddle.net/r3GgM/

    .icon-wrench{
     ...
    display:block;
    width: xxxx;
    height: nnnn;
    }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM