A. 给按钮添加了点击事件，让ul向左移动，设置了transition延时，为什么第一点击没有延时。
你要把代码帖出来看下才知道问题在哪里。
另外 ，做滚动切换效果，有很多现成的库可以用，各种前端框架有自带的Carousel效果
如 bootstrap , antdesign 等。
另外还有一个比较好用的 swiper(有好几个版本，最新版4)，我都用过，官网也有很多示例可以参考。
希望对你有帮助。
B. 前端用jquery如何去获取一个dom未渲染的标签添加点击事件
给要点击的dom加个id或者class，例如叫click-dom
然后$('#click-dom').on('click',function(){
//点击后要做的操作
})
C. 初学后端，django 怎么添加前端按钮点击事件
和django没什么关系。无非两种，get和post。返回到前端页面，刷新或者无刷新，无刷新就用ajax，刷新就重新渲染页面。
D. 关于web前端的一个如何使按钮连接的方法
<html>
<head>
<title>简易计算器</title>
<script>
functiondisplay(val){
vardisplay=document.getElementById("display");
display.value+=val;
}
functionresult(){
vardisplay=document.getElementById("display");
varres=eval(display.value);
display.value=res;
}
functiontoClear(){
document.getElementById("display").value="";
}
window.onload=function(){
document.onkeydown=function(e){
e=e||event;
varkeyCode=e.keyCode;
//alert(keyCode);
varshiftKey=e.shiftKey;
if(shiftKey){//shift+按键
switch(keyCode){
case56:
display("*");
break;
case187:
display("+");
break;
}
}else{//普通按键
switch(keyCode){
case48:
case49:
case50:
case51:
case52:
case53:
case54:
case55:
case56:
case57:
display(keyCode-48);
break;
case67:
toClear();
break;
case106:
display("*");
break;
case107:
display("+");
break;
case109:
case189:
display("-");
break;
case111:
case191:
display("/");
break;
case187:
result();
break;
}
}
}
}
</script>
<styletype="text/css">
input{
height:2.5em;
width:5em;
}
input#display{
width:100%;
}
</style>
</head>
<body>
<tableborder="1"align="center"frame="box"rules="all">
<tr>
<tdcolspan="3"><inputtype="text"id="display"disabled/></td>
<td>
<inputname="按钮"type="button"onClick="result()"value="计算"/></td>
</tr>
<tr>
<td><inputtype="button"value="7"onClick="display(this.value)"/></td>
<td><inputtype="button"value="8"onClick="display(this.value)"/></td>
<td><inputtype="button"value="9"onClick="display(this.value)"/></td>
<td><inputtype="button"value="+"onClick="display(this.value)"/></td>
</tr>
<tr>
<td><inputtype="button"value="4"onClick="display(this.value)"/></td>
<td><inputtype="button"value="5"onClick="display(this.value)"/></td>
<td><inputtype="button"value="6"onClick="display(this.value)"/></td>
<td><inputtype="button"value="-"onClick="display(this.value)"/></td>
</tr>
<tr>
<td><inputtype="button"value="1"onClick="display(this.value)"/></td>
<td><inputtype="button"value="2"onClick="display(this.value)"/></td>
<td><inputtype="button"value="3"onClick="display(this.value)"/></td>
<td><inputtype="button"value="*"onClick="display(this.value)"/></td>
</tr>
<tr>
<td><inputtype="button"value="."onClick="display(this.value)"/></td>
<td><inputtype="button"value="0"onClick="display(this.value)"/></td>
<td><inputtype="button"value="C"onClick="toClear()"/></td>
<td><inputtype="button"value="/"onClick="display(this.value)"/></td>
</tr>
</table>
</body>
</html>
其实主要就是加个键盘事件监听，这里用的keydown，改成keyup亦可，然后主要是了解思想，代码仅供参考
E. 关于前端JavaScript的问题，动态生成的元素怎么绑定事件
闭包问题
你的selectedWord每次循环都重新赋值了，当你执行click函数的时候，循环已经走完了，从作用域链来看，selectedWord指向的是元素最后一个，所以selectedWord.innerHtml里的内容自然不对。
可以用闭包进行处理，让每一次的selectedWord的赋值都是独立在一个作用域中。
或者简单一点，把click中的selectedWord换成this试试。
F. Web前端如何使用Vue编写一个长按指令
今天小编要跟大家分享的文章是关于Web前端如何使用Vue编写一个长按指令?正在从事web前端工作的小伙伴们有没有想过只需按住一个按钮几秒钟就能在你的 G. js怎么给一个按钮添加两个事件
从你给的截图看是要实现这个功能吧.. H. js如何实现等待1秒后执行一个事件 需要准备的材料分别有：电脑、html编辑器、浏览器。 1、首先，打开html编辑器，新建html文件，例如：index.html。 I. 用js怎么写一个回车键盘事件 一、设计思路：设计一个简单的输入对话框，然后按下enter进行输入事件。 二、聊天输入框的代码如下： J. html如何设置打开网页时自动触发按钮的单击事件 在<body>里加一个onload="abc()"的属性就行了，abc()即为处理的方法。
Vue应用中触发一个功能?
有没有想过创建一个按钮，按下一次就可以清除单次输入(或者持续按住可以清除所有输入)?
本文就是讲解如何在按下(或者按住)一个按钮时，既执行一个函数，又清除输入。
首先，我会讲解如何使用纯JS实现。而后也会创建一个Vue指令。下面就让我们一起来看一看吧。
一、原理
要实现长按，用户需要按下并按住按钮几秒钟。
想通过代码模拟这一效果，我们需要在鼠标“点击”按下按钮时，启动一个计时器监听用户按下的时长，如果时间超过我们期望的时长，就执行相应的函数。
非常简单!然而，我们需要知道用户何时按住按钮。
二、如何实现
当用户点击按钮时，在点击事件之前会触发另外两个事件:mousedown和mouseup。
当用户按下按钮时触发mousedown事件，用户松开按钮时调用mouseup事件。
我们需要做的是:
1.mousedown事件触发时，启动计时器。
2.一旦mouseup事件在预期的2秒前被触发，就清除计时器，不要执行相应的函数。就当作一个普通的点击事件。
只要计时器在我们预设的时间内没有被清除，即mouseup
事件没有被触发——那么可以断定用户没有释放按钮。因此，可以判定为一次长按，可以执行关联的函数。
三、实践
让我们深入代码，完成这一功能。
首先，我们必须定义三件事，即:
1.一个变量用于存储计时器。
2.一个启动功能函数，用于启动计时器。
3.一个取消功能函数，用于取消计时器。
1、变量
这个变量主要用来保存setTimeout的值，以便当鼠标mouseup事件触发时我们可以取消它。
letpressTimer=null;
我们把变量值设置为null是为了在执行取消操作前，检查这个变量的值判断当前是否有一个正在运行的计时器。
2、启动函数
这个函数包括一个setTimeout，它是JavaScript中的一个基本方法，允许在特定时间之后执行一个函数。
注意，click事件执行的过程中，会触发另外两个事件。但是我们需要启动计时器的是mousedown
事件。如果只是点击事件，不需要启动计时器。//创建计时器(1s之后执行函数)
letstart=(e)=>{
//如果是点击事件，不启动计时器
if(e.type==='click'&&e.button!==0){
return;
}
//在启动一个定时器之前确保没有正在运行的计时器
if(pressTimer===null){
pressTimer=setTimeout(()=>{
//执行任务!!!
},1000)
}
}
3、取消函数
这个函数见名知意，用来取消启动函数创建的setTimeout。
要取消setTimeout，可以使用JavaScript中的clearTimeout方法，它主要用来清除setTimeout()
方法设置的计时器。
在使用clearTimeout之前，需要检查pressTimer变量是否为null。如果没有为
ull，意味着有一个正在运行的计时器。因此，我们需要先清除它，并且将pressTimer变量设置为null。letcancel=(e)=>{
//检查pressTimer的值是否为null
if(pressTimer!==null){
clearTimeout(pressTimer)
pressTimer=null
}
}
一旦mouseup事件触发，这个函数就会被调用。
4、设置触发器
剩下的就是将事件监听器添加到想要长按效果的按钮上。
addEventListener("mousedown",start);
addEventListener("click",cancel);
以上代码合到一起是这样://定义变量
letpressTimer=null;
//创建计时器(1秒后执行函数)
letstart=(e)=>{
if(e.type==='click'&&e.button!==0){
return;
}
if(pressTimer===null){
pressTimer=setTimeout(()=>{
//执行任务!!!
},1000)
}
}
//停止计时器
letcancel=(e)=>{
//检查是否有正在运行的计时器
if(pressTimer!==null){
clearTimeout(pressTimer);
pressTimer=null;
}
}
//选择id为longPressButton的元素
letel=document.getElementById('longPressButton');
//添加事件监听器
el.addEventListener("mousedown",start);
//长按事件取消，取消计时器
el.addEventListener("click",cancel);
el.addEventListener("mouseout",cancel);
5、用Vue指令包装
创建Vue指令时，可以创建全局或局部指令，本文中，我们采用全局指令。
首先，我们必须声明自定义指令的名称。
Vue.diective('longpress',{
})
这就注册了一个名为v-longpress的全局自定义指令。
接下来，我们添加带参数的bind钩子函数，它允许我们引用指令绑定的元素，获取传递给指令的值，并标识指令使用的组件。Vue.directive('longpress',{
bind:function(el,binding,vNode){
}
})
接下来，我们在bind函数中添加长按功能的代码。Vue.directive('longpress',{
bind:function(el,binding,vNode){
//定义变量
letpressTimer=null;
//定义函数处理程序
//创建计时器(1秒后执行函数)
letstart=(e)=>{
if(e.type==='click'&&e.button!==0){
return;
}
if(pressTimer===null){
pressTimer=setTimeout(()=>{
//执行任务!!!
},1000)
}
}
//取消计时器
letcancel=(e)=>{
//检查是否有正在运行的计时器
if(pressTimer!==null){
clearTimeout(pressTimer);
pressTimer=null;
}
}
//添加事件监听器
el.addEventListener("mousedown",start);
//取消计时器
el.addEventListener("click",cancel);
el.addEventListener("mouseout",cancel);
}
})
接下来，我们需要添加一个函数来运行传递给longpress指令的方法。Vue.directive('longpress',{
bind:function(el,binding,vNode){
//定义变量
letpressTimer=null;
//定义函数处理程序
//创建计时器(1秒后执行函数)
letstart=(e)=>{
if(e.type==='click'&&e.button!==0){
return;
}
if(pressTimer===null){
pressTimer=setTimeout(()=>{
//执行函数
handler();
},1000)
}
}
//停止计时器
letcancel=(e)=>{
//检查是否有正在运行的计时器
if(pressTimer!==null){
clearTimeout(pressTimer);
pressTimer=null;
}
}
//运行函数
consthandler=(e)=>{
//执行传递给指令的方法
binding.value(e)
}
//添加事件监听器
el.addEventListener("mousedown",start);
//取消计时器
el.addEventListener("click",cancel);
el.addEventListener("mouseout",cancel);
}
})
现在，可以在Vue应用中使用这个指令了，除非使用者给指令传入的值不是一个函数。因此，我们需要通过警告反馈给使用者。
为了反馈给使用者，我们在bind函数中添加了以下内容://确保提供的表达式是函数
if(typeofbinding.value!=='function'){
//获取组件名称
constcompName=vNode.context.name;
//将警告传递给控制台
letwarn=`[longpress:]providedexpression'${binding.expression}'isnotafunction,buthastobe`;
if(compName){warn+=`Foundincomponent'${compName}'`}
console.warn(warn);
}
最后，如果这个指令也适用于触屏设备，那会是极好的。因此，我们添加了touchstart、touchend和touchcancel
事件监听器。
最终代码如下:Vue.directive('longpress',{
bind:function(el,binding,vNode){
//确保提供的表达式是函数
if(typeofbinding.value!=='function'){
//获取组件名称
constcompName=vNode.context.name;
//将警告传递给控制台
letwarn=`[longpress:]providedexpression'${binding.expression}'isnotafunction,buthastobe`;
if(compName){warn+=`Foundincomponent'${compName}'`}
console.warn(warn);
}
//定义变量
letpressTimer=null;
//定义函数处理程序
//创建计时器(1秒后执行函数)
letstart=(e)=>{
if(e.type==='click'&&e.button!==0){
return;
}
if(pressTimer===null){
pressTimer=setTimeout(()=>{
//执行函数
handler();
},1000)
}
}
//取消计时器
letcancel=(e)=>{
//检查计时器是否有值
if(pressTimer!==null){
clearTimeout(pressTimer);
pressTimer=null;
}
}
//运行函数
consthandler=(e)=>{
//执行传递给指令的方法
binding.value(e)
}
//添加事件监听器
el.addEventListener("mousedown",start);
el.addEventListener("touchstart",start);
//取消计时器
el.addEventListener("click",cancel);
el.addEventListener("mouseout",cancel);
el.addEventListener("touchend",cancel);
el.addEventListener("touchcancel",cancel);
}
})
现在可以在Vue组件里使用了：
1.在输入框输入页码,按回车后,跳转到对应的页面
2.在输入框输入页码,点击后面的确定按钮,,跳转到对应的页面
这里其实不是把两个事件都绑定到按钮上.而是输入框和按钮各一个.
输入框相应回车事件,按钮相应点击事件.
及input的onkeydown或onkeypress事件,与按钮的click事件.
你可以写一个方法来实现到目标页.
function goPage(){};
input 的onkeydown或onkeypress事件
input.onkeydown=function(){
//在这里先加入判断是否按了回车,,看楼上的.
//然后调用翻页事件.
goPage();
}
按钮的click事件可以直接这么写
btn.click=goPage();
