javascript: функция onclick не работает для электронной почты - PullRequest
Новая
       6

javascript: функция onclick не работает для электронной почты

0 голосов
/ 28 января 2020

у меня есть javascript и внутри ajax таблиц данных, у меня есть эта часть кода 

{   "data": null, 
    "width": "10%",
    "render": function(data){
        icon2 = '<center><button type="button" class="btn btn-info m-btn m-btn--icon m-btn--icon-only btn-sm" ' +
            'data-toggle="m-tooltip" title="" onclick="sendEmail('+data.email+')" data-placement="top" data-original-title="' + 'Send Email' + ' "> <i class="la la-envelope"></i></button>';
        icon2 += '</center>';

    return icon2; }
}

и функция 

function sendEmail(email){
   console.log("email: ", email);
}

но когда я нажимаю кнопку, появляется сообщение об ошибке ** Uncaught SyntaxError: missing) после списка аргументов **.

есть ли другое решение для этого?

Ответы [ 2 ]

0 голосов
/ 28 января 2020

Поскольку литералы должны быть указаны .

Вы не можете просто написать: 

onclick="sendEmail(bob@example.com)"

Этот быстрый и грязный подход заключается просто в добавлении пары ' к данным, но это предполагает, что выиграл ' Не может быть проблем с данными c (например, включая ', " или новые строки).

Вам следует:

  1. Кодировать данные как JSON, поэтому это действительный JavaScript литерал
  2. Кодировать специальные символы в HTML, чтобы они не вызывали HTML проблем с синтаксическим анализом

например 

const email = data.email;
const js_safe_email = JSON.stringify(email);
const html_safe_email = js_safe_email
     .replace(/&/g, "&amp;")
     .replace(/</g, "&lt;")
     .replace(/>/g, "&gt;")
     .replace(/"/g, "&quot;")
     .replace(/'/g, "&#039;");
icon2 = '<center><button type="button" class="btn btn-info m-btn m-btn--icon m-btn--icon-only btn-sm" ' +
        'data-toggle="m-tooltip" title="" onclick="sendEmail('+html_safe_email+')" data-placement="top" data-original-title="' + 'Send Email' + ' "> <i class="la la-envelope"></i></button>';

Это довольно ужасно, но то же самое происходит с объединением строк данных, встроенных в JS, встроенных в HTML. Обычно лучше использовать методы DOM.

0 голосов
/ 28 января 2020

Похоже, ошибка в части "render": function(data){. Эта функция закрыта, но вложение ha sh отсутствует. 

{   "data": null, 
    "width": "10%",
    "render": function(data){
        icon2 = '<center><button type="button" class="btn btn-info m-btn m-btn--icon m-btn--icon-only btn-sm" ' +
            'data-toggle="m-tooltip" title="" onclick="sendEmail('+data.email+')" data-placement="top" data-original-title="' + 'Send Email' + ' "> <i class="la la-envelope"></i></button>';
        icon2 += '</center>';

    return icon2; }
}

Обратите внимание на дополнительные } в конце.

...