错误意外标记},意外标识符

时间:2018-02-21 09:34:51

标签: javascript

点击click_profile_list时出现错误

enter image description hereUncaught SyntaxError: Unexpected identifier

enter image description here

function click_profile_list(choice, profileid, i_array) {
  if(choice==0) {
    alert("Profile",  i_array.firstname);
  }
  else {
    alert("Profile 2" , i_array.firstname);
  }
}

for(var key in msg.db) {
        var bypass = {
          firstname: msg.db[key].firstname, 
          lastname: msg.db[key].lastname,
          email: msg.db[key].user_email,
        };

        //html = '<div class="rows" onclick=click_profile_list(' + input + ',' + msg.db[key].id + ',' + bypass + ');>' ;
        html = '<div class="rows" onclick="click_profile_list(' + input + ',' + msg.db[key].id + ',' + bypass + ');">' ;
        html += msg.db[key].id  + ' - ';
        html += msg.db[key].firstname + ' - ';
        html += msg.db[key].lastname + ' - ';
        html += msg.db[key].fallback;
        html += '</div>' ;


        $('#show_list_window_body').append(html);
      } 

编辑:,已删除,onclick =&#34; function();&#34;加入

$('#show_list_window_body').html(html);
          for(var key in msg.db) {
            var bypass = {
              firstname: msg.db[key].firstname, 
              lastname: msg.db[key].lastname,
              email: msg.db[key].user_email
            };

            var tmp_id = 'iDontKnow' + msg.db[key].id;

            html = '<div class="rows" id="' + tmp_id + '">' ;
            html += msg.db[key].id  + ' - ';
            html += msg.db[key].firstname + ' - ';
            html += msg.db[key].lastname;
            html += '</div>' ;


            $('#show_list_window_body').append(html);
            let $elem = $("<div class='rows' id='" + tmp_id + "'>");
            $elem.click( () => click_profile_list(input, msg.db[key].id, bypass) );
          }

3 个答案:

答案 0 :(得分:3)

删除对象末尾的额外逗号:

var bypass = {
          firstname: msg.db[key].firstname, 
          lastname: msg.db[key].lastname,
          email: msg.db[key].user_email, // <-- Remove this comma
};

然后,在onclick函数周围添加双引号:

html = '<div class="rows" onclick="click_profile_list(' + input + ',' + msg.db[key].id + ',' + bypass + ');">'

或者(更好),附加点击处理程序而不是内联javascript:

let $elem = $("<div class='rows'>")
$elem.click( () => click_profile_list(input, msg.db[key].id, bypass) )

let $clickme = $("<div>Click me!</div>")
$clickme.click(() => alert("it works!"))

$("#main").append($clickme)
#main * {
  font-size: x-large;
  cursor: pointer;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="main"></div>

答案 1 :(得分:2)

这是一个合适的jQuery解决方案:

const msg = {};
msg.db = {
  alice: {
    firstname: "Alice",
    lastname: "Bob",
    user_email: "alice@bob.com",
    id: 1,
    fallback: "fallback"
  },
  charlie: {
    firstname: "Charlie",
    lastname: "Delta",
    user_email: "charlie@delta.com",
    id: 2,
    fallback: "fallback2"
  }
};

function click_profile_list(e) {
  $el = $(e.target);
  var choice = 0; // get from whatever sets this
  var user = msg.db[$el.data("key")];

  if (choice == 0) {
    alert(user.firstname);
  }
}

var input = 0;

for (var key in msg.db) {
  var user = msg.db[key];
  $user = $("<div>").addClass("rows").data("key", key);
  $user.text([user.id, user.firstname, user.lastname, user.fallback].join(" - "));

  $('#show_list_window_body').append($user);
}

$('#show_list_window_body').on("click", ".rows", click_profile_list);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="show_list_window_body"></div>

列表没有让尝试传递对象的内联onclick代码变得笨拙;相反,每个列表项都会获得引用数据库密钥的data-key属性。单击时,会回读key;这用于从数据库中获取相关数据。

答案 2 :(得分:1)

你有两个语法错误。一个在您的JavaScript中,另一个在您生成的HTML标记中。

JS

{% if my_model.my_function("123") %}
    Hello World
{% endif %}

HTML

var bypass = {
          firstname: msg.db[key].firstname, 
          lastname: msg.db[key].lastname,
          email: msg.db[key].user_email, // <--- here is your issue, you should not use a comma after the last object element
        };

您必须使用单引号或双引号包含属性onclick的值。在您的代码中,只需用双引号html = '<div class="rows" onclick=click_profile_list(' + input + ',' + msg.db[key].id + ',' + bypass + ');>' ;

包装它

查看@Jeremy Thille's answer以获得更好的方法。