小编DA.*_*DA.的帖子

如何绑定'touchstart'和'click'事件但不回复两者?

我正在开发一个必须在各种设备上运行的移动网站.黑莓手机让我头疼的是黑莓.

我们需要支持键盘点击和触摸事件.

理想情况下,我只是使用:

$thing.click(function(){...})
Run Code Online (Sandbox Code Playgroud)

但我们遇到的问题是,这些黑莓设备中的一些从触摸到触发点击时会有非常烦人的延迟.

解决方法是改为使用touchstart:

$thing.bind('touchstart', function(event){...})
Run Code Online (Sandbox Code Playgroud)

但是,如何绑定这两个事件,但只触发一个?我仍然需要键盘设备的click事件,但当然,如果我使用触摸设备,则不希望点击事件触发.

一个额外的问题:是否有这样做,另外还适用于甚至没有touchstart事件的浏览器?在研究这个问题时,看起来BlackBerry OS5不支持touchstart,因此还需要依赖该浏览器的点击事件.

附录:

也许更全面的问题是:

使用jQuery,是否可以/建议使用相同的绑定处理触摸交互和鼠标交互?

理想情况下,答案是肯定的.如果没有,我有一些选择:

1)我们使用WURFL获取设备信息,因此可以创建我们自己的设备矩阵.根据设备的不同,我们将使用touchstart或点击.

2)通过JS检测浏览器中的触摸支持(我需要对此进行更多的研究,但似乎这是可行的).

但是,这仍然存在一个问题:支持BOTH的设备如何.我们支持的一些手机(即Nokias和黑莓手机)同时具有触摸屏键盘.所以这种方式让我完全回到原来的问题......是否有办法允许两者同时以某种方式?

jquery click touchstart

193
推荐指数
8
解决办法
37万
查看次数

在各个类名上使用'starts with'选择器

如果我有以下内容:

<div class="apple-monkey"></div>
<div class="apple-horse"></div>
<div class="cow-apple-brick"></div>
Run Code Online (Sandbox Code Playgroud)

我可以使用以下选择器来查找前两个DIV:

$("div[class^='apple-']")
Run Code Online (Sandbox Code Playgroud)

但是,如果我有这个:

<div class="some-other-class apple-monkey"></div>
<div class="apple-horse"></div>
<div class="cow-apple-brick"></div>
Run Code Online (Sandbox Code Playgroud)

它只会找到第二个DIV,因为第一个div的类以字符串形式返回(我认为)并且实际上并不以'apple-'开头,而是'some-'

一种方法是不使用开头,而是包含:

$("div[class*='apple-']")
Run Code Online (Sandbox Code Playgroud)

问题是它还会在我的例子中选择第三个DIV.

问题:通过jQuery,在单个类名上使用谓词选择器的正确方法是什么,而不是将整个类属性用作字符串?它只是抓住CLASS,然后将它分成一个数组,然后用正则表达式遍历每个单独的一个?或者是否有更优雅/更简洁的解决方案?

jquery

145
推荐指数
4
解决办法
13万
查看次数

在继续之前等待一个功能完成的正确方法?

我有两个JS函数.一个叫另一个.在调用函数中,我想调用另一个,等待该函数完成,然后继续.所以,例如/伪代码:

function firstFunction(){
    for(i=0;i<x;i++){
        // do something
    }
};

function secondFunction(){
    firstFunction()
    // now wait for firstFunction to finish...
    // do something else
};
Run Code Online (Sandbox Code Playgroud)

我提出了这个解决方案,但不知道这是否是一个聪明的方法.

var isPaused = false;

function firstFunction(){
    isPaused = true;
    for(i=0;i<x;i++){
        // do something
    }
    isPaused = false;
};

function secondFunction(){
    firstFunction()
    function waitForIt(){
        if (isPaused) {
            setTimeout(function(){waitForIt()},100);
        } else {
            // go do that thing
        };
    }
};
Run Code Online (Sandbox Code Playgroud)

这是合法的吗?是否有更优雅的方式来处理它?也许用jQuery?

javascript jquery delay pausing-execution

144
推荐指数
7
解决办法
38万
查看次数

使用jquery获取元素相对于视口的位置

获取页面上元素相对于视口(而不是文档)的位置的正确方法是什么.jQuery.offset功能似乎有希望:

获取第一个元素的当前坐标,或者在匹配元素集中相对于文档设置每个元素的坐标.

但这与文件有关.是否存在相对于视口返回偏移量的等效方法?

javascript jquery position viewport offset

115
推荐指数
4
解决办法
13万
查看次数

具有多个条件的javascript if语句是否测试了所有这些条件?

在javascript中,当使用具有多个条件的if语句进行测试时,javascript是否会对它们进行全部测试,或者在测试它们之前是否会保释,如果它已经是假的?

例如:

 a = 1
 b = 2
 c = 1

 if (a==1 && b==1 && c==1)
Run Code Online (Sandbox Code Playgroud)

将javascript测试所有这3个条件,或者在看到b不等于1之后,因此是假的,它会退出语句吗?

我从表演的角度问道.例如,如果我正在测试3个复杂的jQuery选择器,我宁愿不让jQuery遍历DOM 3次,如果它通过第一个显然会返回FALSE.(在这种情况下,嵌套3 if语句更有意义).

附录:更多的好奇心,这个的正确用语是什么?我注意到你们很多人都使用"短路"一词.还有,有些语言会这样做而其他语言不这样做吗?

javascript

91
推荐指数
5
解决办法
8万
查看次数

如何在jQuery .each()的每次迭代之间添加暂停?

我正在抓取一个jQuery对象数组,然后通过.each()修改数组中的每个单独的jquery.

在这种情况下,我更新了类名以触发-webkit-transition-property以利用css转换.

我想在每次css转换开始之前暂停一下.我正在使用以下内容,但每次更新之间没有延迟.相反,它们似乎都在立即更新.

function positionCards() {
  $cards = $('#gameboard .card');
  $cards.each(function() {
      setTimeout( function(){ addPositioningClass($(this)); }, 500 )
  });
}

function addPositioningClasses($card){
  $card
    .addClass('position')
}
Run Code Online (Sandbox Code Playgroud)

我希望setTimeout可以解决这个问题,但它似乎没有起作用.有没有办法在每个对象的每个CLASS名称更新之前完成暂停?

each jquery settimeout

73
推荐指数
3
解决办法
8万
查看次数

滑动时防止touchstart

我在移动设备上有一个可滚动的列表.他们希望人们能够通过滑动滚动列表,并通过点击选择一行.

抓住了两者.如果您实际滚动列表,我不希望选择一行.这是我发现的:

滚动时不触发:

  • 点击
  • 鼠标松开

滚动时是否触发:

  • 鼠标按下
  • touchstart
  • touchend

简单的解决方案就是坚持点击事件.但我们发现,在某些黑莓设备上,touchstart之间存在非常明显的延迟,然后触发点击或鼠标.这种延迟足以使其在这些设备上无法使用.

所以这给我们留下了其他选择.但是,使用这些选项,您可以滚动列表而不触发您触摸的行以启动滚动.

解决此问题的最佳做法是什么?

javascript jquery scroll touch touch-event

40
推荐指数
4
解决办法
5万
查看次数

获取iPhone GO按钮以提交表单

是否有人知道哪些变量进入表单以使iPhone虚拟键盘的GO按钮提交表单与否?

我一直在努力缩小场景,这就是我发现的:

  • 如果FORM只有一个用户输入字段,则go按钮会自动提交表单

  • 如果FORM有多个用户输入字段,但没有INPUT TYPE ="SUBMIT",则GO按钮不提交表单.

  • 如果FORM有多个用户输入字段并且INPUT TYPE ="SUBMIT",则go按钮确实提交表单.

然而,这并不完全准确,因为我们遇到了第三种情况不适合我们的情况.

是否有人知道GO按钮工作与不工作的其他因素?

html forms iphone keyboard

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

适合iOS/Mobile Safari优化CSS 3动画的正确方法?

我正在使用PhoneGap构建一个iPad应用程序.我正在尝试使用CSS转换来制作动画,但我并不完全确定我正在使用正确的方法来利用设备可能支持的任何硬件加速.

这是一个模态窗口(DIV),我想从页面顶部向下滑动.它开始位于屏幕顶部,然后通过jquery添加一个类动画到页面本身:

.modal {
      background: url('../images/bgnd-modal.png');
      width: 800px;
      height: 568px;
      position: absolute; 
      top: -618px;
      left: 100px;
      z-index: 1001;
      -webkit-transition: top .25s ease-in; 
  }
.modal.modalOn {
      top: 80px;
  }
Run Code Online (Sandbox Code Playgroud)

当使用iOS 4部署到iPad 2上时,这可以工作,但动画稍微不稳定.这不是一个完全流畅的动画.我应该使用不同的CSS来处理这个吗?或者这可能只是一个副作用,它是一个PhoneGap应用程序和有问题的DIV有一个大的背景图像?

webkit ios css-animations

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

blur()vs. onblur()

我有一个带有onblur事件监听器的输入标签:

<input id="myField" type="input" onblur="doSomething(this)" />
Run Code Online (Sandbox Code Playgroud)

通过JavaScript,我想触发此输入上的模糊事件,以便它反过来调用该doSomething函数.

我最初的想法是调用模糊:

document.getElementById('myField').blur()
Run Code Online (Sandbox Code Playgroud)

但这不起作用(虽然没有错误).

这样做:

document.getElementById('myField').onblur()
Run Code Online (Sandbox Code Playgroud)

这是为什么?.click()将通过onclick监听器调用附加到元素的click事件.为什么不blur()以同样的方式工作?

javascript jquery onblur

22
推荐指数
2
解决办法
11万
查看次数