SCRIPT1014: Invalid character - Quote symbol

Question

I have this problem:

array[i].idAuthor is a String variable. I want to pass this String to a function which is called inside an append-String.

The code works fine in Chrome and Firefox except for Internet Explorer. IE gives me this error: SCRIPT1014: Invalid character

I think the issue are the `-Quotes.

I hope the following example helps to express my problem.

<script>
(...)
    $("#id").append("<div onClick='myFunc(`" + array[i].idAuthor + "`);'>" + i + "</div>");
(...)
<script>

Is there another way to handle my situation or to replace the `-Quotes with another character that is compatible with IE?

Answer 1

//create element using jquery
var elm = $('<div>');

//put ID as custom attribute
elm.attr('data-author-id', array[i].idAuthor);

//put some html content for new element
elm.html(i);

// catch click on it
elm.click(function(){
    // call external function and pass your custom tag attribute as value
    myFunc( $(this).attr('data-author-id') );
});

    $("#id").append(elm);

something like that should work.

of more shot way:

$("#id").append($('<div>')
.attr('data-author-id', array[i].idAuthor)
.html(i)
.click(function(){
    // call external function and pass your custom tag attribute as value
    myFunc( $(this).attr('data-author-id') );
}));

jQuery have lot of functionality control tag attributes, events, values and lot's of useful stuff.

Answer 2

It looks like you're putting backticks (`) into your string there.

onClick='myFunc(`" + ... + "`);'>

In modern browsers, backticks are used for template literals. IE11 doesn't support template literals.

Instead, try escaping your quotes:

onClick='myFunc(\"" + array[i].idAuthor + "\");'>

Answer 3

You should use normal quotes, but escape them so they are parsed as part of the string:

$("#id").append("<div onClick='myFunc(\"" + array[i].idAuthor + "\");'>" + i + "</div>");
//------------------------------------^^   ----------------------^^