标签: javascript-events

有没有一种简单的方法在jQuery中检测滚动条何时出现并消失在有溢出的div上:auto？(就像一个事件？手指交叉......)

(我不想看看div内容的高度)

div元素没有onscroll事件处理程序吗？我页面上的行为似乎并不表示onscroll识别div 事件处理程序.

<div id='bd' onscroll='alert("Scroll Called");'></div>

另外,
根据DOM事件冒泡,是否将div滚动事件汇总到窗口滚动事件？

我试图简单地检查我是否有一个空的输入文本框但是当我在chrome中运行时出现此错误:

Uncaught TypeError: Cannot read property 'length' of undefined.

以下是我如何去做.我检查DOM准备情况然后调用该函数.

function walkmydog() {
    //when the user starts entering                                                                                                                                                
    if(document.getElementById('WallSearch').value.length == 0) {
        alert("nothing");
    }
}

if (document.addEventListener) {
    document.addEventListener("DOMContentLoaded", walkmydog, false);
}

我想阻止focusOut(或blur)事件的默认事件,并将焦点设置为特定的输入字段.

这是我已经尝试过的:

• 使用event.preventDefault()之初,在函数结束时(用于测试目的,而不是风格)

• return false; 防止传播

• 将焦点直接设置回元素中的元素(但我发现焦点仍然会切换,因为焦点开关在函数执行后.on()执行.我知道我可以使用setTimeout,但我想避免它并弄清楚心脏这个问题.)

• 使用blur而不是focusOut

我的代码是这样的:

    _triggerEventHide: function(inst, eventType) {
        inst.$target.on(eventType, function(event) {
            event.preventDefault();
            if (!$.suggestBox.$divCont.hasClass($.suggestBox.mouseOverClassName)) {
                $.suggestBox.$divCont.css({display: 'none'});   //reposition Suggestbox
            } else {
                inst.target.focus(); 
            }
            event.preventDefault();
            return false;
        });
     }

注意,它$target表示jQuery包装的元素并target表示本机DOM元素.

我做了一些研究,已经发现了一些与我的问题相关的文章,但没有一个回答这个问题.

1. preventDefault对焦点事件不起作用 - 这里给出的答案是使用任何类型的事件操作的替代路径.

2. 如果没有必要的值,将焦点反射回文本框 - 这里,解决方案是用来setTimeout()将焦点设置回原始元素,这是好的,但我想了解问题的核心,为什么preventDefault()是不在这里工作.

3. jQuery preventDefault()不起作用 - 我尝试了一些可能的解决方案来自这个线程,比如使用event.stopImmediatePropagation()和event.stop(),但一切都没有用.

我感谢任何时候,知识和解决方案(包括尝试)在这件事上的贡献.我真的想学习......

这是一个jsFiddle,向您展示问题...随意玩它并尝试不同的解决方案.

我正在使用css变换比例在div上创建平滑缩放.问题是我希望能够获得与div相关的正确鼠标位置,即使在按比例放大时也是如此,但我似乎可以找出正确的算法来获取这些数据.我正在检索当前的比例因子

var transform = new WebKitCSSMatrix(window.getComputedStyle($("#zoom_div")[0]).webkitTransform);
scale = transform.a;

当我在不同比例设置下读取div的位置时,它似乎报告了正确的位置,即当我缩放div时,直到屏幕上的位置更大,左边的位置和顶部值是负的并且看起来是正确的,就像返回的比例值:

$("#zoom_div").position().left
$("#zoom_div").position().top

要获取当前鼠标位置,我将从click事件中读取x和y位置并取消偏移量.这在缩放值1(无缩放)时正常工作,但在缩放div时不能正常工作.这是我的基本代码:

$("#zoom_div").on("click", function(e){
    var org = e.originalEvent;

    var pos = $("#zoom_div").position();

    var offset = {
        x:org.changedTouches[0].pageX - pos.left,
        y:org.changedTouches[0].pageY - pos.top
    }

    var rel_x_pos = org.changedTouches[0].pageX - offset.x;
    var rel_y_pos = org.changedTouches[0].pageY - offset.y;

    var rel_pos = [rel_x_pos, rel_y_pos];
    return rel_pos;
});

我已经多次尝试将除法加法和从比例X/Y中减去比例因子,但没有任何运气.任何人都可以帮我弄清楚如何获得正确的价值.

(我已经简化了我原来的代码,希望能让我的问题更加清晰,你在上面的代码中找到的任何错误都是由于编辑失败.我的原始代码除了鼠标位置问题外).

为了说明我在说什么,我做了一个快速的jsfiddle示例,允许使用translate3d拖动div.当刻度正常时(1)div被拖动到点击它的位置.当div按比例放大时(2)它不再从点击的位置正确拖动.

http://jsfiddle.net/6EsYG/12/

我有以下代码来创建一些元素

<div id="parent">
    <div id="block_1" >
        <div>
          <input type="text">
        </div>
        <img src="arrow.jpg">
        <div>
          <input type="text">
        </div>
        <div><a href="#" class="remove_block">Remove</a></div>
    </div>
</div>

结果看起来像这样

当用户按下ADD按钮时,它将转到javascript函数并创建相同的div块.这是代码

function add_block() {
var curDiv = $('#parent');
var i = $('#parent div').size()/4 + 1;
var newDiv='<div id="block_'+ i + '" class="parent_div">' +
'<div>' +
'<input type="text">' +
'</div>' +
'<img src="arrow.jpg">' +
'<div>' +
'<input type="text">' +
'</div><div><a class="remove_block" href="#">Remove</a></div>' +
'</div>';
$(newDiv).appendTo(curDiv);
};

每当用户按下块左侧的"删除"链接时,应删除相应的块.这就是我做的:

$('a.remove_block').on('click',function(events){
   $(this).parents('div').eq(1).remove();
});

问题是只有原始块中的删除工作,其余的没有.谁知道为什么？

我是jQuery和javascript的新手,所以我非常感谢任何帮助和建议注意:我使用的是jQuery 2.0.3

我正在寻找一个事件监听器,它的作用类似于jQuery的.resize(),但只有当调整大小的对象(谈论窗口)在x轴或两者中调整大小时才会触发,但不会仅在y轴上调整. - 所以基本上它只会监听宽度的调整大小事件.

我ng-swipe在移动设备上遇到组合和水平滚动问题.用例是我有一个页面,刷卡应该下一个或上一个加载,内部有模块显示很多信息.其中一些是滚动的.

因此,只要您滚动父母的滑动即可开始导航.所以我ng-swipe在可滚动元素的父级上添加了另一对这种技巧:

self.onInnerSwipe = function($event) {
  $event.originalEvent.preventAction = true;
};

然后在父母身上:

var shouldActionProceed = function($event) {
  return !$event || !$event.originalEvent || !$event.originalEvent.preventAction;
};

self.goToPrev = function($event) {
  if (shouldActionProceed($event)){
    // Do Magic
  }
}

如果我在该元素上滑动但滚动不能正常工作,这就行动不会继续.它有种类,但事实并非如此.它开始一点然后停止.

在Chrome上,有时会记录此警告.

忽略尝试取消具有cancelable = false的touchmove事件,例如因为滚动正在进行且无法中断.

我在这里准备了一个演示:http://jsbin.com/webologavu/2/这个过于简单,但你可以重现这个问题.

任何提示？

我知道,我可以扩展一个栅格在对象Paper.js,以及一个TextItem和路径.

但是,我想在拖动Raster,TextItem或Path的选择线或边界框时执行此操作,就像在像Word这样的程序中调整图像大小时一样.这些边界形成一个Rectangle对象.我可以使用这种fitBounds方法挂钩吗？或者更广泛地说,如何在Raster,TextItem或Path的选择线上捕获鼠标拖动事件？我想,一旦我能做到这一点,我就可以使用该scale方法来增长/收缩对象.

这是一个Paper.js 草图,可以帮助你开始和实验,借鉴@Christoph.另请参阅Paper.js 的文档.

我知道在元素上禁用onclick事件的方式是:

element.onclick = null;

启用:

element.onclick = function(){
   // something
};

要么

element.addEventListener("click", me);

这很好但是当你有几个元素 - 每个元素具有不同参数值的相同功能 - 使用这种方式会变得有点烦人.有没有办法可以在不牺牲初始函数及其参数的情况下禁用它？

我希望保持函数的方式,而不必将其设置为null或其他东西,以便禁用.