切換SVG與jQuery的.html（）

我試圖來打開並單擊兩個SVG：切換SVG與jQuery的.html（）

$('.close').html() == '<svg class="btn_back"><use xlink:href="#btn_back"></use></svg>' ? $(this).html('<svg class="btn_i"><use xlink:href="#btn_i"></use></svg>') : $(this).html('<svg class="btn_back"><use xlink:href="#btn_back"></use></svg>');

的HTML是：

<div class="back"><svg class="btn_i"><use xlink:href="#btn_i"></use></svg></div>

第一單擊內容IST更換btn_back svg顯示正確。當我第二次點擊.close svg不會改變。

是.html()錯誤的工具？

感謝您的任何幫助！

來源

2017-04-13 Philipp Wilhelm Schäfer

請閱讀[。點擊（）]（https://api.jquery.com/click/）和[html的（）]（https://api.jquery.com/html/ ）。發佈你的問題之前，你應該已經完成了。這就是*「搜索和研究」。*在[問]中的含義。 –

這是我該怎麼做：

我會切換一個類。基於此，我會切換HTML，這比進行字符串比較要快。此外，.html()並不總是返回一個字符串，所以我認爲你更安全。可能不完美，但比你的方法好一點。

$(document).on('click','.close', function(e){ 
    var close = $(e.target).closest('.close'); 
    close.toggleClass('on'); 
    close.html(close.hasClass('on') ? 
    '<svg class="btn_i"><use xlink:href="#btn_i"></use></svg>', 
    '<svg class="btn_back"><use xlink:href="#btn_back"></use></svg>' 
    ); 
})

來源

2017-04-13 13:45:46

謝謝安德烈！對於不好的搜索和研究感到抱歉，但是當我用tex代碼而不是svg工作時。我在jQuery中並不擅長。 –

@PhilippWilhelmSchäfer，沒有什麼值得遺憾的。今天你有機會學習一些東西，所以你應該感恩。其中之一就是在詢問之前（重新）搜索你的問題。總的來說，這會讓你提出更好的問題並獲得更好的答案。 –

切換SVG與jQuery的.html（）

回答

相關問題