在手工menu.js文件中放置图标而不是“+”或“ – ”

我正在制作一个手风琴菜单。
我刚刚找到这个链接http://jsfiddle.net/zM5Vj/ ，它几乎类似于我制作的手风琴菜单。
在代码中，有的地方

if($(this).text() == "-") { $(this).text("+"); } else { $('#accordion .opener').text("+"); $(this).text("-"); } }); 

如果输入“+”和“ – ”，我想放置图标“〜/ Image / iconplus.gif”和“〜/ Image / iconminus.gif”。 我怎么做的？
我试过了

但它仍然没有用。
请任何人可以帮忙吗？
提前致谢。

Answer 1

$(this).text()允许您为元素指定纯文本内容。 要附加图像，请使用$(this).append($( 。

此外，不是使用$(this).text() == '-'来查看菜单是否已展开，而是将类附加到元素。

例如，我们可以使用.addClass('expand')来表示菜单已经展开，然后使用.hasClass('expand')检查菜单是否已展开，最后是'.removeClass('expand')来指示菜单不再展开）。

这是一个例子，使用虚拟图像来说明：

的jsfiddle

 $(function(){ //starter plus image var startPlus = $('').attr('src','http://findicons.com/files/icons/1688/web_blog/48/add.png') .css({'height': '20px', 'width': '20px'}); $('#accordion .fullChild>a.opener').addClass('box') .append(startPlus); $('#accordion .opener').click(function() { //images for click event handler var plusImg = $('').attr('src','http://findicons.com/files/icons/1688/web_blog/48/add.png') .css({'height': '20px', 'width': '20px'}); var minusImg = $('').attr('src','http://findicons.com/files/icons/2083/go_green_web/64/subtract.png') .css({'height': '10px', 'width': '10px'}); if($(this).hasClass('expand')) { $(this).empty() .append(plusImg) .removeClass('expand'); } else { $(this).empty() .append(minusImg) .addClass('expand'); } }); }); 

Answer 2

谢谢大家回应并帮助我解决问题。
@Simon Adcock，您的回答给了我一种思考解决方案的新方法。
但是，我也找到了一个解决方案。
我刚刚将此行添加到我的.js文件中

  $(this).append($('')) 

所以，最后回答是：

 if (x == "block") { $(this).text(''); $(this).append($('')) $(this).append(' ' + valueText); } else { $(this).text(''); $(this).append($('')) $(this).append(' ' + valueText); }