如何通过HTML onclick事件发送两个参数? [英] How can I send two parameters with a HTML onclick event?

查看:45
本文介绍了如何通过HTML onclick事件发送两个参数?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有此事件,它将ID参数发送到生成URL的函数,但是我想发送两个参数,而不仅仅是ID.我也想发送名字.

使用此代码,我只能发送一个参数,但是我需要发送两个参数.
根据

解决方案

这两个参数正串在一起形成一个字符串文字-因此,如果您检查该元素或在源代码中找到它,则它应如下所示:

 < a href =#" onclick ="generateURL('133​​7,testName');">行名</a> 

一种解决方案是在逗号前后添加转义的单引号(即 \'):

 '< li id ="link4">< a href =#" onclick ="generateURL(\''+ jsonObject.id +'\',\''+ jsonObject.name +'\');>行名</a</li>';; 

在下面的示例中观察第1个 st 列表中的链接与第2个 nd 列表中的链接之间的差异:

  var jsonObject = {名称:"testName",id:1337};document.addEventListener('DOMContentLoaded',function(){var liHTML ='< li id ="link4">< a href =#" onclick ="generateURL(\''+ jsonObject.id +','+ jsonObject.name +'\');">行名​​</a>/li>';document.getElementById('theList').innerHTML = liHTML;liHTML ='< li id ="link5">< a href =#" onclick ="generateURL(\''+ jsonObject.id +'\',\''+ jsonObject.name +'\');>行名</a</li>';;document.getElementById('theOtherList').innerHTML = liHTML;});函数generateURL(id,name){console.log('generateURL()-id:',id,'name:',name);}  

  1< sup> st</sup>列表:< ul id ="theList"></ul>2< sup> nd</sup>列表:< ul id ="theOtherList"></ul>  

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:

解决方案

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>

这篇关于如何通过HTML onclick事件发送两个参数?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆