标签: javascript-events

如何使用"AddEventListener"方法将Doubleclick事件添加到Canvas元素?

我只是想在HTML5 Canvas元素中添加双击事件.它适用于:

myCanvas.ondbclick
Run Code Online (Sandbox Code Playgroud)

但是,我想使用addEventListener方法来做到这一点.我想这可能是一个简单的任务,但我到处搜索,无法找到它.我应该使用的活动的名称是什么?

myCanvas.addEventListener('doubleclick?', function(){ 

  // Some dazzling stuff happens be here

});
Run Code Online (Sandbox Code Playgroud)

希望有可能,不要"打破"我的编码一致性.

javascript html5 canvas javascript-events

18
推荐指数
1
解决办法
4万
查看次数

有没有办法检测按下Alt键的哪一侧(右侧或左侧)?

有没有办法我们可以检测出Alt按键被按下哪一侧,即区分左或右Alt?我看到的地方,它可能与IE浏览器与altLeft和altRight该属性Event的对象.如果这是正确的,我们如何在Firefox中使用JavaScript检测它?

这是它在IE中的工作原理altLeft:

window.onload = function(){
  document.getElementById('id').onkeydown = function(){
    alert(window.event.altLeft);
  }
}
Run Code Online (Sandbox Code Playgroud)

javascript javascript-events

18
推荐指数
2
解决办法
3719
查看次数

Javascript检测在Mouseup上保持的控制键

我搜索了很多,似乎找不到满意的解决方案.我希望有人能帮帮忙.

当我使用jQuery时,我也在编写数千行Javascript.所以一个"纯粹的"JavaScript解决方案就好了.

我正在尝试确定控制键是否在物理上按下鼠标事件.而已; 没有其他先决条件.有没有人知道如何可靠,跨浏览器这样做?

我已经尝试通过记录按下和释放按键时将其存储在状态变量中:

// BEGIN store control key status in hash_state
$().bind('keydown','ctrl',function( arg_obj_e ){
  hash_state.sw_ctrldn = true;
  console.debug( hash_state.sw_ctrldn );
});
$().bind('keyup','ctrl',function( arg_obj_e ){
  hash_state.sw_ctrldn = false;
  console.debug( hash_state.sw_ctrldn );
});
// END store control key status in hash_state
Run Code Online (Sandbox Code Playgroud)

但是,这确实不起作用.如果你使用firebug测试它并观察控制台,你会发现自动重复似乎发生了,并且值切换.

我检查了mouseup事件以查看是否有任何有用的东西,但无济于事:

var debugEvent = function( arg_obj_e ){
  var str = '';
  for ( var attr in arg_obj_e ){
    str += attr + ': ' + arg_obj_e[attr] + '\n';
  }
  console.debug(str);
}
Run Code Online (Sandbox Code Playgroud)

任何帮助,将不胜感激.

javascript jquery javascript-events

17
推荐指数
1
解决办法
1万
查看次数

拉斐尔帆布(背景)onclick事件

我一直在与Raphael合作,在画布上创建拖放形状.我使用.drag()函数(在Raphael框架中提供)和我的事件函数来完成此操作.我这样做没有问题.

我还有一个在dblClick上创建一个新形状的函数,问题是,我只能将事件附加到形状或我创建的其他元素.

向形状添加事件的方式如下:

  R = Raphael("canvas", "100%", "100%"),
  R.rect(100, 100, 25, 50).attr({fill: fillColor}).dblclick(myDblClick);
Run Code Online (Sandbox Code Playgroud)

在画布上使用相同的原理不起作用:

  R = Raphael("canvas", "100%", "100%"),
  R.dblclick(myDblClick);
Run Code Online (Sandbox Code Playgroud)

有没有人知道将点击事件附加到画布的方法,即我可以点击div中的任何位置(不包括形状),然后触发事件.

谢谢.

javascript jquery frameworks javascript-events raphael

17
推荐指数
2
解决办法
1万
查看次数

js:了解alert()如何影响浏览器事件循环

我正在考虑向我们的javascript实用程序断言函数添加alert().

我们是一个ajax繁重的应用程序,我们的框架(Ext)通过使用setInterval轮询ajax响应而不是等待readystate == 4来实现ajax的方式,导致我们所有的ajax回调在setInterval堆栈上下文中执行 - - 一个异常/断言吹出它通常会无声地失败.

低级别alert()如何影响浏览器事件循环?根据定义,消息框必须允许win32事件循环泵(响应mbox按钮).这是否意味着其他浏览器事件,就像我们的框架生成的未来setIntervals,调整大小事件等,要火?这会给我带来麻烦吗?

IIRC:您可以使用FF2和FF3.5来查看我正在谈论的差异.

alert('1');
setTimeout(function(){alert('2');}, 10);
alert('3');
Run Code Online (Sandbox Code Playgroud)

FF 3.5显示1-3-2.FF2 [1]显示1-2和3(2和3同时堆叠在一起).我们可以使用从activex启动的win32 mbox在IE8中复制1-2和3,而不是在当天对我们造成严重破坏的警报,我想确保我们不再沿着那条路走下去.

任何人都可以向我指出解释这种行为的特定低级资源,这里的预期行为是什么,以及在低级别上究竟发生了什么,包括为什么行为在FF版本中发生了变化?

[1]你可以在Spoon.net上复制这个,我现在无法正常工作.我只是用FF 2.0.0.20在vm中重新编写它.

javascript winapi javascript-events settimeout

17
推荐指数
2
解决办法
2344
查看次数

如何知道何时加载特定"div"中的所有图像?

我的HTML页面的一部分如下div:

<div id="images_wrapper">
  <img ... />
  <img ... />
  <img ... />
  ...
</div>
Run Code Online (Sandbox Code Playgroud)

最初,这div是隐藏的,我只在加载所有图像时显示它:

$(window).load(show_images_wrapper);
Run Code Online (Sandbox Code Playgroud)

但是,如果我没有弄错,show_images_wrapper只有在加载所有页面时才会调用.我想show_images_wrapper在内部所有图像images_wrapper加载后立即调用,并且不要等到所有页面都加载完毕.

我试过了:

$("#images_wrapper").load(show_images_wrapper);
Run Code Online (Sandbox Code Playgroud)

但它不起作用.

我该怎么做?

html javascript jquery javascript-events

17
推荐指数
2
解决办法
6803
查看次数

如何从java脚本对象中引发自定义事件

我试图更好地理解Java脚本中面向对象的技术.

我有下面的(普通)对象.

function CustomObject () {
    this.size = 1;
};

CustomObject.prototype.addSize = function () {
    this.size += 1;
    if(this.size > 5) {
        //Raise custom Event
    }
};
Run Code Online (Sandbox Code Playgroud)

而我正在这样设置它.

   var myObject = new CustomObject();
    myObject.addSize();

    // Add listener for custom event from with in my Custom Object.
    // Something like this....
    myObject.addEventListener("CustomEvent", handelCustomEvent, false);

    function handelCustomEvent() {}
Run Code Online (Sandbox Code Playgroud)

如何在自定义对象中引发自定义事件,然后在父级中侦听该事件?在Java脚本中这种事情甚至可能吗?

javascript javascript-events

17
推荐指数
1
解决办法
2万
查看次数

jQuery事件冒泡

我想了解如何解释冒泡.这是否意味着上升HTML代码层次结构或其他东西?

其次,我正在经历一个例子,我无法理解它所说的最后一部分

基于P的点击处理程序侦听click事件,然后阻止它传播(冒泡)

这是什么意思?

javascript jquery live javascript-events event-bubbling

17
推荐指数
2
解决办法
4万
查看次数

document.write清除页面

为什么在下面的代码中,document.write在函数调用时,validator()表单元素(复选框和按钮)将从屏幕中删除?

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript">
            function validator() {
                if (document.myForm.thebox.checked)
                    document.write("checkBox is checked");
                else 
                    document.write("checkBox is NOT checked");
            }
        </script>
    </head>
    <body>
        <form name="myForm">
            <input type="checkbox" name ="thebox"/>
            <input type="button" onClick="validator()" name="validation" value="Press me for validation"/>
        </form>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

html javascript javascript-events

17
推荐指数
3
解决办法
4万
查看次数

如何在React.js中触发keypress事件

我是React.js的新手.我正在尝试触发文本div的按键事件.

这里是我要执行按键触发器的文本框代码.

<div id="test23" contenteditable="true" class="input" placeholder="type a message" data-reactid="137">Hii...</div>
Run Code Online (Sandbox Code Playgroud)

和按键方法是

onKeyPress: function(e) {
   return "Enter" == e.key ? "Enter key event triggered" : void 0)
}
Run Code Online (Sandbox Code Playgroud)

我用jquery尝试了但是我无法触发它.

这是我尝试过的React代码,但它不起作用.

var event = new Event('keypress', {
 'keyCode' : 13,
 'which' : 13,
 'key' : 'Enter'
});
var node = document.getElementById('test23');
node.dispatchEvent(event);
Run Code Online (Sandbox Code Playgroud)

谢谢 :)

javascript jquery javascript-events reactjs

17
推荐指数
2
解决办法
4万
查看次数