Html改變文本的<a>標記

我目前正在使用以下標記，該標記呈現爲僅帶有圖標的按鈕。
我希望這是圖標後跟Export PDF這個詞。Html改變文本的<a>標記

通常，我不會去創建像這樣的按鈕，但我正在使用一個Kendo控件來爲我生成按鈕。一旦呈現的按鈕看起來如下：

<a href="" role="button" class="k-tool k-group-start k-group-end" 
    unselectable="on" title="Export PDF"> 
    <span unselectable="on" class="k-tool-icon k-pdf"></span> 
    <span class="k-tool-text">Export PDF</span> 
</a>

我試圖使用jQuery我想要的文字注入元素如下：

<script> 
     $(document).ready(function() { 
      $('.k-tool-icon').text("Export PDF"); 
     }); 
</script>

但是這不會改變任何東西。我仍然只有一個圖標的按鈕。

編輯：下面是渲染上面貼HTML的C＃MVC劍道編輯：

@(Html.Kendo().Editor() 
     .Name("editor") 
     .HtmlAttributes(new { style = "height:900px" }) 
     .Pdf(pdf => pdf 
      .Margin(20, 20, 20, 20) 
      .ProxyURL(Url.Action("Pdf_Export_Save", "Editor")) 
    ) 
     .Tools(tools => tools 
      .Clear() 
      .Pdf() 
    ) 
     .Value(@<text> 
     <code> 
      @Html.Raw(HttpUtility.HtmlDecode(Model.ReportString)) 
     </code> 
    </text>) 
    )

來源

2016-04-26 GregH

適用於我https://jsfiddle.net/j08691/f0pcyx1q/ – j08691

該圖標可能使用文本替換技術。設計.k-tool-text span文件有什麼問題？ – moopet

@ j08691因爲你實際上沒有使用劍道編輯器，所以它可能適合你？我不確定。然而，它絕對不適合我 – GregH

如果要更換這將是更快的內容使用本地DOM

在您在上面給出的代碼示例在按鈕前後具有相同的文本。

Before: <span class="k-tool-text">Export PDF</span> 
After: $('.k-tool-icon').text("Export PDF");

// Use Native DOM for better performace 
$(document).ready(function() { 
    document.querySelector('.k-tool-icon').textContent = `Export PDF`; 
});

但反正你在這裏顯示的代碼工作。

來源

2016-04-26 14:25:19 CodeWizard

我已經發布了我正在使用的kendo控件的代碼。這一定是它不適合我的原因，但是正在爲那些直接使用kendo製作的html的人工作 – GregH

@peggy，可能你的問題是，在文檔準備好之後，kendo進程延遲很多，而不是當它試圖添加文本時，由kendo生成的元素仍然不存在。

嘗試添加$('.k-tool-icon').text("Export PDF");某些事件時，劍道已經完成處理;

來源

2016-04-26 14:37:42

Html改變文本的<a>標記

回答

相關問題