参数列表后未捕获到的SyntaxError:缺少),我尝试了多种方法

时间:2019-07-11 09:24:43

标签: javascript jquery

for(var key in result)
{
    var html = '';
    html += '<li class="item item_chat">' +
    '<div class="product-img">' +
    '<img src="' + base_url + '/assets/img/noimage.png" alt="Product 
      Image" class="img-size-50">' +
    '</div>' +
    '<div class="product-info">' +
    '<a href="javascript:void(0)" onclick="viewGroupBody(this,' + 
       result[key].id + ',' + result[key].name + ');" class="product- 
       title">' + result[key].name +
    '<span class="badge badge-danger float-right"> Group </span></a>' +
    '<span class="product-description"> Message </span>' +
    '</div>' +
    '</li>';
    $('#messageListDashGroups').append(html);
}

我在onclick函数的这一行出现错误

'<a href="javascript:void(0)" onclick="viewGroupBody(this,' + 
           result[key].id + ',' + result[key].name + ');" class="product- 
           title">' + result[key].name +

在使用两个参数之前

onclick="viewCusBody(this,' + id + ')"

但是现在我添加了一个额外的参数,所以我遇到了问题

1 个答案:

答案 0 :(得分:1)

您可以尝试使用Template literals

  

模板文字是允许 嵌入表达式 的字符串文字。您可以使用 多行字符串 字符串内插 功能。

演示:

var base_url = "test.com";
var result_id = "some_id";
var result_name = "jhon";

var html = `<li class="item item_chat">
            <div class="product-img">
            <img src="${base_url}/assets/img/noimage.png" alt="Product 
            Image" class="img-size-50">
            </div>
            <div class="product-info">
            <a href="javascript:void(0)" onclick="viewGroupBody(this,'${result_id}','${result_name}');" class="product- title">${result_name}
            <span class="badge badge-danger float-right"> Group </span></a>
            <span class="product-description"> Message </span>
            </div>
            </li>`;
$('#messageListDashGroups').append(html);
    
function viewGroupBody(el, id, name){
  console.log(id)
  console.log(name);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="messageListDashGroups"></div>

对于IE:通过更改尝试传统方式

onclick="viewGroupBody(this,' + result[key].id + ',' + result[key].name + ');"

收件人

onclick=viewGroupBody(this,"'+result['key'].id+'","'+result['key'].name+'")

var base_url = "test.com";
var result = {key:{id: "some_id", name:"john"}};

var html = '';
html += '<li class="item item_chat">' +
'<div class="product-img">' +
'<img src="' + base_url + '/assets/img/noimage.png" alt="Product Image" class="img-size-50">' +
'</div>' +
'<div class="product-info">' +
'<a href="javascript:void(0)" onclick=viewGroupBody(this,"'+result['key'].id+'","'+result['key'].name+'"); class="product- title">'+
'<span class="badge badge-danger float-right"> Group </span></a>' +
'<span class="product-description"> Message </span>' +
'</div>' +
'</li>';
$('#messageListDashGroups').append(html);

function viewGroupBody(el, id, name){
  console.log(id)
  console.log(name);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="messageListDashGroups"></div>