在使用object.innerHTML或$object.append创建带有onclick事件的div标记时，它不允许我也传递变量
在使用object.innerHTML或$object.append创建带有onclick事件的div标记时，它不允许我也传递变量。
这是因为在使用object.innerHTML或$object.append方法创建元素时，传递的参数会被解析为字符串形式插入到HTML文档中。而onclick事件需要执行JavaScript代码，如果直接将变量作为字符串插入到onclick事件中，将无法正确解析和执行。
解决这个问题的方法是使用addEventListener方法来动态绑定事件，并将变量作为参数传递给事件处理函数。具体步骤如下：
- 创建一个div元素，并将其赋值给一个变量，例如：var divElement = document.createElement('div');
- 使用addEventListener方法为div元素添加click事件，并定义事件处理函数，例如：divElement.addEventListener('click', function() { // 在这里编写处理点击事件的代码，可以访问外部变量 });
- 将div元素插入到文档中的指定位置，例如：document.body.appendChild(divElement);
通过这种方式，可以动态创建带有onclick事件的div标记，并且可以在事件处理函数中访问外部变量。
关于腾讯云相关产品，推荐使用云函数（Cloud Function）来实现动态绑定事件的需求。云函数是腾讯云提供的无服务器计算服务，可以让开发者在云端运行代码，无需关心服务器的运维和扩展。您可以使用云函数来创建一个处理点击事件的函数，并将其与前端页面进行关联。具体使用方法和产品介绍可以参考腾讯云云函数的官方文档：云函数产品介绍。
相关·内容
我有一个模式表单，它在单击带有特定类的锚标记时加载。
我试图实现的是，当单击锚标记时，将值应用到mdoal表单中的某个文本字段。
在单击锚标记时，使用id=“联系人-目录”的输入字段使用锚标记中的值填充该函数：
<input type="text" id="contact-catalogue" />
<a class="button-left contact" href="#" onclick="document.getElementById('contact-catalogue').v
浏览 4提问于2014-02-26得票数 0
回答已采纳
我正在使用DojoMobileV1.5.1开发一个网页。
下面是示例代码。
<div dojotype="dojox.mobile.View" selected="true" id="view1">
<div dojotype="dojox.mobile.Heading" label="dojox.mobile.Heading"></div>
<div dojotype="dojox.mobile.EdgeToEdgeCategory" label=
浏览 1提问于2011-11-17得票数 0
回答已采纳
我有一个锚标记，它具有如下所示的OnClick事件
<a id="btnSave" href="javascript: void[0];" onclick="btnSave(ID,Email ,CompanyName,address)" />
function btnSave(ID, Email, CompanyName, address)
{
alert(ID, "+", Email, "+", CompanyName, "+", address);
}
在我的视图中，我将这些值
浏览 0提问于2014-08-18得票数 0
回答已采纳
1回答
我有一个组件TopBar.vue，我正在尝试打开一个模式(一个子组件Feedback.vue)。
如何在两个组件之间绑定showFeedbackModal属性？
我希望这样做，以便当您单击带有<a>的@click="showFeedbackModal = true标记时，值true被传递给<feedback>组件，并显示模型。
TopBar.vue (Main)
<template>
<div>
<section class="top-bar level">
&l
浏览 2提问于2017-06-12得票数 3
回答已采纳
不是一个重复的，因为我请求一个"offclick"事件(如果有的话)是为了隐藏一个元素，而不是如何隐藏这个元素。
我有一个带有display: none;的容器，只有在使用onclick="myFunction()".单击<textarea>标记时才会显示它但是，一旦在display: none;之外单击容器，我希望将其设置为<textarea>。
对此是否有任何等效的offclick？
function myFunction() {
$('.testing').css({
display: 'in
浏览 1提问于2019-10-22得票数 0
回答已采纳
5回答
var map = L.map('map');
var marker = L.marker([10.496093,-66.881935]).on('click', onClick);
function onClick(e) {alert(e.latlng);}
marker.addTo(map)
当我单击标记时，警告消息是: undefined
但是如果我把它放在变量map中，它就能工作！(显示纬度和经度)
map.on('click', onClick);
有人知道为什么它在标记中不起作用吗？
浏览 2提问于2013-06-05得票数 76
回答已采纳
这里我们有一个带有onclick处理程序的div：
<div id="BorderContainer1282" onclick="alert('hello')">
<input id="Button925" type="button" value="Button">
</div >
当点击时，它会显示一个警告对话框。
HTML是否支持在同名的子标记中内联JavaScript，如下所示：
<div id="BorderContainer1282
浏览 6提问于2016-07-25得票数 0
1回答
我有链接，当用户单击时，它会将数据附加到div中，如下所示：
<a href="javascript:void(0);" onclick="StartMesssage()">
<span class="font-icon fa fa-pencil"></span>
</a>
<script>
function StartMesssage(){
$(".div1").append(
'<sectio
浏览 1提问于2016-05-08得票数 0
回答已采纳
<!DOCTYPE HTML>
<html>
<body>
<link type="text/css" rel="stylesheet" href="example.css">
<div class="d1">1
<div class="d2">2
<div class="d3">3
</div>
</div>
</div>
浏览 6提问于2013-06-26得票数 3
回答已采纳
我想创建带有jquery UI对话框的弹出窗口，一个参数recordtype将决定要加载的对话框的内容和按下对话框的按钮时要调用的函数。
function showPopup(div_id, w, h, title, recordtype, recordid) {
$(div_id).dialog({
height: h,
width: w,
title: title,
modal: true,
autoOpen: true
});
//----extend the ui featur
浏览 0提问于2012-02-15得票数 2
回答已采纳
我对jquery中的.click()事件有一个问题。我创建了一个带有按钮的输入标记，然后当我单击这个标记时，它必须显示一条警告消息。但它不起作用。下面是HTML代码：
<div id="test">
</div>
<input type="button" id="btn" value="Submit" />
和Jquery代码：
$("#btn").click(function(){
html = "<input type='text
浏览 0提问于2014-09-03得票数 3
回答已采纳
我已经创建了一个4x4的<div>网格，您可以在其中单击单元格，浏览器会提示您输入数字。如果您输入文本，文本将显示在您刚刚单击的网格中。 我让它在以下代码中工作： <div onclick="this.innerHTML=prompt('Enter a number')"></div> 但是，当我尝试将此功能实现为以上述代码为模型的函数时，我无法从提示符获得要放入innerHTML属性的输入。这是我尝试过的： function setText() {
this.innerHTML=prompt('Enter a
浏览 30提问于2020-08-14得票数 1
回答已采纳
开发环境
react.js
打字脚本
next.js
当按下span标记时，我不想触发onClick进程。
我应该如何实现它？
return (
<div className="padding-16 flex gap-5 flex-container" onClick={onClickUser}>
<img src={img} />
<div className="flex flex-direction gridgap-5">
<p>
{na
浏览 0提问于2020-11-12得票数 0
回答已采纳
1回答
我目前正在一个网站工作，但我是全新的HTML和JQuery。
我目前有以下网站：
下面是使用JQuery动态生成的HTML代码：
<div class="gallery-card" id="SOME_ID" onclick="ViewSelected(this.id)" style="background-color: rgb(206, 20, 186);">
<strong class="StrongClass">Carlos Ba</strong>
<
浏览 0提问于2018-08-09得票数 1
回答已采纳
3回答
我正在学习Ajax，我在这个非常基本的功能上遇到了一些问题：
函数fetchData(url，objectID){
var pageReqtest=null;
if(window.XMLHttpRequest)pageRequest=new XMLHttpRequest();
if(window.ActiveXObject)pageRequest=new ActiveXObject("Microsoft.XMLHTTP");
else return false;
pageRequest.onreadystatechange= function(){
浏览 1提问于2011-12-17得票数 0
我试图创建一个3次克隆元素的按钮，但是当我试图更改克隆onclick()时，它不会克隆对象。
var html = document.getElementById("kaart" + kaart_id).innerHTML;
kaart_id = kaart_id + 1;
var clone = document.createElement("div");
clone.innerHTML = html;
clone.id = "kaart" + kaart_id;
clone.classList = "memory_kaart"
浏览 3提问于2022-06-13得票数 0
回答已采纳
我正在尝试使用event onlick发送参数。但是如果用户没有点击，我也想设置默认参数。
<script>
function getItems(value, object) {
var parametar = object.innerHTML=value; //receive parameter
//then I send parameter to API
</script>
单击上面的脚本可显示参数。但是如果用户没有点击，我想设置参数1。如果用户点击，参数将会改变。
<div class="vertical-menu">
浏览 0提问于2018-03-18得票数 0
当我在<div contentEditable>中使用<mark>标记时，将按预期标记文本。
现在，当我删除带有Backspace的标记并在删除后重新键入一些新字符(内容可编辑的最后一个字符)时，就会创建一个<font style="..."><span style="...">new text。
<div id="editable" contentEditable>
Here is some <mark>text</mark> for testing!
浏览 4提问于2021-10-14得票数 0
我已经开发了onclick功能，它可以执行特定的操作，而不管单击何种标记，似乎当我单击子标记或子单击事件时，它的相关父单击事件就会自动触发。
需要防止事件或处理与特定标记相关的事件被单击。
我想要的是，当单击父标记时，只有父单击函数才会触发，如果单击子标记，则只应触发子onclick事件。
使用reactjs应用程序(reactjs)开发的相同功能，但结果是相同的，无法单独处理onclick事件。
<div onClick="console.log('div tag click event fired')">
<h1 onClick=&
浏览 7提问于2019-12-30得票数 1
回答已采纳
1回答
我需要在同一页上显示不同的元素，使用四个按钮来过滤它。如果我点击NavigationBar组件的第一个按钮，必须显示一个特定的div。
我有一个主页，必须显示不同的元素：
class Home extends Component {
constructor(props) {
super(props);
}
showContent() {
alert('ok');
}
render() {
return (
<div className="container">
<He
浏览 2提问于2018-02-05得票数 0
回答已采纳
我使用显示带有标记的地图，当您单击标记时，所有的信息窗口都会打开。我想只显示一个标记的信息窗口时，我点击它，并为其他保持关闭。
这是我的代码：
<GoogleMap
defaultZoom={15}
defaultCenter={{ lat: 51.508530, lng: -0.076132 }}
>
{props.places && props.places.map((place, i) =>
<Marker onClick={props.onToggleOpen
浏览 9提问于2017-11-09得票数 5
回答已采纳
我有一个动态创建的div：
<div id="submit"></div>
我只想添加一个"onclick“的sessionStorage，如下所示：
<div id="submit" onClick="sessionStorage.setItem('status', '2')></div>
我试着做这样的事情：
<script>
$("#submit").click(function(){ sessionStorage.setItem(&
浏览 2提问于2016-04-16得票数 0
回答已采纳
我有一个非常简单的带有js代码的html页面：
<html>
<head>
<title></title>
</head>
<body>
<div id="divButtons">
</div>
<script type="text/javascript">
var arrOptions = new Array();
浏览 5提问于2011-02-18得票数 13
回答已采纳
(关于进一步的背景，这涉及到与相同的工作)
我正在创建一个基于JavaScript的网络聊天系统，使用jQuery来简化生活。所有的webchat JavaScript代码都在一个外部js文件中，然后由html页面引用并实例化该文件。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>WebchatV3</title>
<script type="text/javascript" src="/JavaScript/jqu
浏览 1提问于2009-04-22得票数 1
回答已采纳
3回答
我只是试图提交一个简单的表单到同一页，但当它被提交时，它会在同一页上调用PHP函数。然而，在提交之前，我正在尝试做一些JavaScript验证。所以我想知道在表单标签中使用onSubmit调用js函数和使用带有按钮的onClick调用js函数有什么区别……这就是我目前正在尝试做的事情。
<?php
function tobecalled()
{
echo "This was run";
}
?>
<html>
<head><title>Testing</title>
<script
浏览 7提问于2011-01-20得票数 1
回答已采纳
下面的示例代码使用了react路由器和上下文挂钩，在这里，我试图理解为什么当我使用锚而不是链接组件时，它的行为会有所不同。链接组件被注释掉。
这个应用程序只是显示一个带有html链接的屏幕，你可以点击它来显示组件2(组件1是最初显示的)。我正在更新锚点的onClick事件中的上下文值(我使用setName函数更新上下文中的名称)。
当我使用锚标记时，它不会保留被更新的上下文值。因此，当它转到component2时，上下文中的名称值将显示为person1。但是，如果我注释掉锚并使用Link组件，则上下文值将被正确更新。
为什么链接组件在更新上下文时按预期工作，而不是锚点？
import Reac
浏览 3提问于2020-12-22得票数 1
回答已采纳
当我的页面上有这个HTML标记时，如何在jquery中检索span最接近的隐藏字段值？
<div>
<div class="div1">
<input id="Hidden1" type="hidden" class="temp_parent" value="xxx" />
<div>
<span class="a123" onclick="findparentHidden
浏览 4提问于2013-11-12得票数 1
回答已采纳
我有一个带有onclick操作的div列表。在每个div中都有一个普通的链接。当我单击该链接时，javascript被执行(这很快)，然后与该链接相关联的新页面开始加载(片刻之后)。
我可以对链接做什么来使它不执行javascript -尽管它位于脚本中定义的div中？有没有办法将它排除在关联之外，或者告诉它停止所有的javascript onclick？
谢谢!
浏览 0提问于2012-06-20得票数 0
回答已采纳
我的页面中有两个具有不同in的html控件，当我单击a标记时，我想调用DoSomething方法。
<div>
<a href="javascript:void(0);" onclick="DoSomething();">
<span id="spnValue" >Value1</span>
</div>
<div>
<a href="javascript:void(0);" onclick="DoSomething();&#
浏览 2提问于2015-09-22得票数 3
回答已采纳
我有一些代码，其中一些用于更改div的类，其余的用于将内容加载到ajax div中。
但是，ajax div不加载内容。为什么会这样呢？
<script>
window.onload = function () {
var everyone = document.getElementById('everyone'),
favorites = document.getElementById('favorites');
everyone.onclick = function() {
loadXMLDoc(
浏览 1提问于2013-08-18得票数 0
我在react层次结构的顶层有一个元素数组，我想用一个带有元素值(字符串)的参数来启动一个onClick函数。但是，当我尝试打印此值时，将打印一个“代理”对象：Proxy {dispatchConfig: null, _targetInst: null, isDefaultPrevented: null, isPropagationStopped: null, _dispatchListeners: null…}。
以下是我的呈现函数中的代码：
return collapseChoices.map((choice) => {
console.log(choice)
浏览 0提问于2017-05-17得票数 10
回答已采纳
我正在尝试返回一个带有<li>的eventListener元素。但是我希望<li>将它拥有的属性传递给函数onClick。具体而言，我指的是：
return (<li onClick={this.changeTab(tab_id)} tab_id={index + 1} <a href="#">{obj.display_name}</a></li>);
但是如果你这样做，你会收到error: Uncaught ReferenceError: tab_id is not defined
如您所见，tab_id是由
浏览 3提问于2015-06-23得票数 0
回答已采纳
2回答
我是JQuery的新手，希望有人能帮我解决我遇到的问题。
为了方便起见，我创建了一个带有问题的JSFiddle页面：
问题:当我点击按钮“测试1”或“测试2”，然后点击产生的黑色覆盖，覆盖消失了，但是淡入的内容仍然留在页面上，直到按下“取消”按钮。
有趣的旁注:如果我点击按钮“测试1”或“测试2”来产生内容效果，然后点击取消，一切都会按预期工作(覆盖和内容淡出)，然后如果我再次点击按钮“测试1”或“测试2”，没有重新加载页面，然后单击覆盖，一切都会按预期工作。
Javascript文件：
$(document).ready(function(){
lbHide();
})
funct
浏览 0提问于2013-01-17得票数 0
回答已采纳
我有一个表格，我想给它的所有单元格分配一个css悬停。但与此同时，我有一个带有bg图像的div标签，它与表格具有相同的宽度和高度，并且它位于表格的顶部，具有相对位置。我怎么能仍然将css悬停分配给表格的单元格，因为当我尝试它时，它不起作用，我认为这是因为当我检测div标记时……
有人知道解决这个问题的方法吗？
注意:它必须与IE9一起工作(也不能使用css3 )
浏览 2提问于2012-10-22得票数 0
我使用ng-click在另一个标签中使用ng-click进行标记。当我点击internal标记时，它启动了两个函数，而不仅仅是内部函数。示例：
<div ng-click="gotoChat()" >
<i class="icon" ><button ng-click="Close()" class="button button-assertive">סגור בקשה</button></i>
</div>
浏览 0提问于2016-10-11得票数 0
任何关于我如何解决这个问题的意见.
我的目标是让用户在搜索栏中搜索“Jane Smith”，单击“搜索”按钮并显示包含“Jane Smith”的卡片。
目前，用户搜索的是“Jane Smith”，它被保存为“term”，一旦用户单击搜索按钮，“fetchStudents”函数就会失败，表示它没有“term”
我在将'term‘值从SearchBarInput标记传递到SearchBarButton标记时遇到了困难，因此在学生容器中，我可以在mapDispatchToProps函数中使用它。
我的searchBar组件由
const SearchBar = ({ onClick,
浏览 1提问于2019-03-14得票数 0
回答已采纳
当我单击<a...标记时，不会调用我的函数。
我的组件中有以下代码：
public htmlstr: string;
public idUser:number;
this.idUser = 1;
this.htmlstr = `<a (click)="delete(idUser)">${idUser}</a>`;
public delete(idUser){
alert("id " + idUser);
}
我的html
<div [innerHTML]="htmlstr"></div&
浏览 32提问于2018-02-16得票数 5
假设我想更改所有span标记的innerHTML，当单击这些标记时，这些标记具有属性'data- change '：
$('span[data-change]').click(function(){
$(this).text('Text was changed dynamically');
});
现在，如果我使用javascript上的jQuery在html文档中添加一个带有数据更改属性的新span标记，onclick事件将无法在新添加的span标记上工作。为什么？我怎样才能让它们发挥作用？谢谢!
浏览 2提问于2013-09-19得票数 2
回答已采纳
下面的面板只填充基于REST调用的标题面板(带有标题)。如何根据面板标题中的ID填充主体部分下面()的DIV标记？我不知道角质会有多大效果。
<accordion id="0022" close-others="false">
<accordion-group isopen="opened" is-open="opened">
<accordion-heading>
浏览 0提问于2014-07-16得票数 0
回答已采纳
我有这个成分在反应。每当我单击带有类'btn‘的标记时，我都希望在同一个li元素中添加/切换一个类'open’到div (类'smenu‘)。我像下面这样天真地实现了它，但是我相信还有另外一种更有效的方法。如有任何建议，将不胜感激。提前感谢
import React, { useState } from "react";
const AccordioMenu = () => {
const [activeP, setActiveP] = useState(false);
const [activeM, setActiveM] = useS
浏览 0提问于2019-09-11得票数 1
回答已采纳
我想创建一个带有onclick事件处理程序的div，如下所示
element.innerHTML = '<div onclick="somefunction(e, 10)"></div>';
其中e是事件对象，10是其他随机参数。我似乎找不到一个方法来做这件事。有可能吗？
请注意，我不想单独创建子元素，然后将其附加到父元素。
浏览 1提问于2011-11-02得票数 0
2回答
我有个问题。当我从后台代码向按钮添加事件处理程序时，该事件永远不会触发。但是，当我在创建按钮标记时添加它时，它工作得很好，我正在从后台代码创建按钮，并将其添加到表中。
<form id="form1" runat="server">
<div>
<asp:Button ID="Button1" runat="server" Text="show table" OnClick="Button1_OnClick&
浏览 5提问于2013-08-08得票数 3
回答已采纳
在不使用jQuery或任何其他库的情况下，目的是通知用户将使用警报事件访问哪个URL。在标记中，有多个<a>标记，每个标记具有不同的href值，当用户单击<a>标记时，会显示一个alert事件，说明用户在实际离开网站之前要去哪里。
工作流：
文件加载
用户单击<a>标记
显示带有单击的alert标记的href值的<a>事件。
一旦用户关闭alert事件，浏览器将开始加载href网站。
代码示例：
document.querySelector('a').onclick = function(e) {
浏览 24提问于2022-06-03得票数 1
回答已采纳
3回答
JS函数是
function func(arg){
alert(arg);
}
当我这样做的时候
echo "<div onclick=\"func($arg)\">Text</div>";
在php中，它不起作用，但当我这样做时
echo "<div onclick=\"func()\">Text</div>";
它可以工作，并弹出一个带有未定义文本的警报。
如何传递参数？
浏览 1提问于2013-07-02得票数 0
回答已采纳
6回答
我有一个关于Jquery中的.click函数的问题。我有这样的代码：
for (var i = 0; i < 5; i++) {
var divTest = $('<div></div>');
divTest.text("My Div " + i);
divTest.click(function() {
alert("Alert: Div " + i);
});
$('#myTest').append(divTest);
}
我希望在"
浏览 1提问于2012-10-17得票数 8
回答已采纳
我在javascript中生成了一个带有'innerHTML‘属性的'div’元素。
(...).innerHTML = 'sometext'+'<div id=\"a\">word</div>'+obj.something+'othertext';
无论如何，onclick事件不起作用。
document.getElementById('a').onclick = function() {
//do something
}
有什么问题吗？如何解决这个问题(纯java
浏览 4提问于2015-08-07得票数 3
回答已采纳
每当我按下按钮，但它不起作用时，请有人帮我做错事。
这是主页的代码
import Header from './Header';
import TinderCards from './TinderCard';
import SwipeIcon from './SwipeIcon';
import { useNavigate } from 'react-router-dom';
const Home = () => {
const navigator = useNavigate();
retur
浏览 9提问于2022-01-19得票数 0
我正试图在bindPop中创建一个按钮侦听器函数。但是it does not read parameter of onclick function。在下面的代码alertConfirmed()function works fine中，but filterEventsBasedOnCluster(feature) does not read the parameter 'feature'。它说特性没有定义为。特性是一个对象。
这里是代码：
layer.bindPopup('<div id="alert">Found...!<input
浏览 3提问于2017-02-10得票数 0
我想在details标记上应用一个onClick事件。但是，我发现在应用事件之后，单击details和summary之外的元素也会触发事件。 我的问题是:如何使onClick事件仅在单击details和summary标记时触发，而不在任何其他元素上触发？ 下面是一个示例:单击Panel content将触发控制台日志。我只希望在单击Panel title时触发该函数。 Panel.js import React from "react";
const Panel = ({ toggleDetails, id }) => {
return (
<deta
浏览 16提问于2021-02-01得票数 0
回答已采纳
那么，当我点击一个标记时，地图总是刷新的，我如何防止它呢？单击一个标记将呈现关于该标记的特定信息，但它总是重新加载并返回到其defaultCenter。
import React, { Component } from "react";
import { withGoogleMap, GoogleMap, Marker } from "react-google-maps";
import maplayout from "./mapstyle.js";
class Map extends Component {
state = { user
浏览 3提问于2018-08-22得票数 5
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
