问题
I have this event that sends the ID parameter to a function that generates a URL, but I want to send two parameters instead of just the ID. I'd like to send the name also.
With this code I can only send one parameter, but I need to send two.
Based on this other post where one parameter is passed, I tried the following:
'<li id="link4"><a href="#" onclick="generateURL(\'' + jsonObject.id + '\');">Line</a></li>'
This is the method that generates my URL
function generateURL(id, name)
{
window.location.href = 'https://www.example'+ id + name + '.com';
}
In other words I'm trying to imitate this:
<a href="#" onclick="generateURL(jsonObject.id, jsonObject.name)></a>
And if I try this:
'<li id="link4"><a href="#" onclick="generateURL(\'' + jsonObject.id + ',' + jsonObject.name + '\');">Line Name</a></li>'
This happens:
回答1:
The two arguments are being strung together into one single string literal - so if you inspect that element or find it in the source, it should look like below:
<a href="#" onclick="generateURL('1337,testName');">Line Name</a>
One solution is to add escaped single-quotes (i.e. \'
) before and after the comma:
'<li id="link4"><a href="#" onclick="generateURL(\'' + jsonObject.id + '\',\'' + jsonObject.name + '\');">Line Name</a></li>';
Observe the difference between the link in the 1st list and the link in the 2nd list in the example below:
var jsonObject = {
name: 'testName',
id: 1337
};
document.addEventListener('DOMContentLoaded', function() {
var liHTML = '<li id="link4"><a href="#" onclick="generateURL(\'' + jsonObject.id + ',' + jsonObject.name + '\');">Line Name</a></li>';
document.getElementById('theList').innerHTML = liHTML;
liHTML = '<li id="link5"><a href="#" onclick="generateURL(\'' + jsonObject.id + '\',\'' + jsonObject.name + '\');">Line Name</a></li>';
document.getElementById('theOtherList').innerHTML = liHTML;
});
function generateURL(id, name) {
console.log('generateURL() - id: ', id, 'name: ', name);
}
1<sup>st</sup>List: <ul id="theList"></ul>
2<sup>nd</sup>List: <ul id="theOtherList"></ul>
回答2:
You're passing in one continuous string as the first argument, id
, into generateURL(id, name), instead of passing two individual arguments, id
and name
. In other words, these are the arguments you use:
id:
\'' + jsonObject.ln_org_code + ',' + jsonObject.ln_name + '\'
name:
(hence why
name
is undefined in your screenshot)
To fix this, simply remove the quotes from the comma between your two arguments. This comma separates id
and name
, and will register jsonObject.ln_org_code
as the id and jsonObject.ln_name
as the name. Additionally, be careful with the tick mark placement on your first forward slash. Personally, I would not concatenate the strings until the function call.
In other words, here is how your function call should look.
<li id="link4"><a href="#" onclick="generateURL(('\' + jsonObject.ln_org_code), (jsonObject.ln_name + '\'));">Arranque de Linea</a></li>
回答3:
remove the quotes from the comma between your two arguments. This comma separates id and name, and will register jsonObject.ln_org_code
as the id and jsonObject.ln_name
as the name. Additionally, be careful with the tick mark placement on your first forward slash. Personally, I would not concatenate the strings until the function call.
Here is how your function call should look.
<li id="link4"><a href="#" onclick="generateURL(('\' + jsonObject.ln_org_code), (jsonObject.ln_name + '\'));">Arranque de Linea</a></li>
来源:https://stackoverflow.com/questions/43074876/how-can-i-send-two-parameters-with-a-html-onclick-event