javascript 中出現missing ) after argument list的錯誤

今天在寫html頁面中使用JavaScript拼湊DOM元素時，出現“missing ) after argument list ”的錯誤，試了很長時間才解決，記錄以便以後查看

<ul class="dropdown-menu" id="menus">
<script type="text/javascript">
$(function () {
$.post('/ImageManager/GetAllImageData?plugin=LS.SGYC.Management', { page: 1, rows: 100 }, function (data) {
 $.each(data, function (index, value) {
 $('#menus').append("<li><a href='javascript:void(0)' onclick='showCompareImage(" + value.ImageUrl + ")'>" + value.ImageName + "</a></li>");
})
 }, 'json')
})
</script>
</ul>

錯誤出在下面這句代碼

$('#menus').append("<li><a href='javascript:void(0)' onclick='showCompareImage(" + value.ImageUrl + ")'>" + value.ImageName + "</a></li>");

主要是雙引號和單引號的嵌套使用
測試一、測試解決方案時，試着在value.ImageUrl處添加單引號（如下）

$('#menus').append("<li><a href='javascript:void(0)' onclick='showCompareImage('" + value.ImageUrl + "')'>" + value.ImageName + "</a></li>");

結果出現“unexpected }”的錯誤
測試二、將最外面的雙引號和內部的單引號，全部互換，如下

$('#menus').append('<li><a href="javascript:void(0)" onclick="showCompareImage("' + value.ImageUrl + ')">' + value.ImageName + '</a></li>');

發現錯誤任然存在。
查找解決方案後，使用轉義符將雙引號進行轉義，解決問題，最終代碼如下：

$('#menus').append("<li><a href='javascript:void(0)' onclick='showCompareImage(\"" + value.ImageUrl + "\")'>" + value.ImageName + "</a></li>");

GOOD LUCK！！！