标签: jquery-click-event

所以我正在使用Javascript和jQuery创建一个表,我想要它,这样当你点击表格第一行的td时,那个列中其余的td就会下拉.让我试着通过展示我的代码来解释它.这是我的Javascript:

function createTr (heights) { //heights is just an array of words
    for (var h=0; h<heights.length; h++) { 
        var theTr = $("<tr>", { id: "rowNumber" + h});
        for (var i=0; i<heights.length-3; i++) { 
            theTr.append($("<td>", { "class": "row"+h + " column"+i,
                                     html: heights[h][i]
                                   }));
        }
        $('#newTable').append(theTr); // append <tr id='rowNumber0'> to the table (#newTable), which is written in the html
    }
}

这基本上创建了td,每个td类似于这种格式

<td class="rowh columni">

我想要它,以便除了.row0中的td之外都隐藏所有td,如果你点击.row0 .columni中的td,那么.columni中的所有td都会出现.参数'heights'是一个数组,例如,它可以是

var heights = [['headerOne', 'headerTwo'], ['someTd', 'anotherTd'],];

并且它将使用这些单词创建一个表,headerOne和headerTwo将在第一行中,someTd和anotherTd将在第二行中.

现在,当我尝试添加这样的点击功能时

function animation() {
    $('td').click( …

我目前正在升级我的应用程序以使用jQuery 1.6.1(以前使用1.4.4),并发现现在该.click()事件.change()也会自动触发事件.

我在这里创建了一个简单的例子:http://jsfiddle.net/wDKPN/

请注意,如果包含1.4.4,.change()则在触发事件时不会触发该函数.click().但切换到1.6时,该.change()事件是发射时.click()被触发.

两个问题:

1. 这是一个错误吗？ 似乎以编程方式触发.click() 也不应该触发其他事件(例如,自动触发.blur()并.focus()帮助"模仿"用户的点击似乎也是错误的).

2. 什么是我绑定的正确方法change()事件,然后触发这两个一click()和change()事件为元素？ 我是否只是打电话.click(),并依赖于也.change()将开火的事实？

   $('#myelement').change(function() {
        // do some stuff
   });
   
   $('#myelement').click(); // both click and change will fire, yay!
   

   Run Code Online (Sandbox Code Playgroud)

在我的旧代码中,我使用此模式在ajax调用之后初始化一些复选框(及其检查的状态和值):

    $('#myelement').change(function() {
         // do some stuff including ajax work
    }).click().change();

但是在1.6.1中,我的逻辑会激发两次(一次为.click()一次,一次为一次.change() …

我想使用以下jQuery动态地向我的页面添加一个输入字段:

var inputNode = "<input id='inputNode' class='tiContent' type='text'
    placeholder='text input...'/>";
$("div").append(inputNode);

在这样做之后,我希望输入字段具有闪烁文本光标的焦点,所以我想在创建后立即键入它.

有人可以告诉我我该怎么做？

我试过打电话

$(inputNode).focus()

并且也尝试过

$(inputNode).trigger('click')

但他们都没有工作.点击后我可以输入字段,但正如我所说,我想立即键入而不进行任何交互.

我们在屏幕上显示一个框,当用户点击屏幕上的任何位置时,我想隐藏它,包括正文,锚点,div,按钮等...是否有一个选择器可以为我处理这个？或者是一个案例$('body, a, div, input').click()？

默认情况下,单击鼠标中键将在新选项卡中打开链接.

有些网站最终破坏了这一功能.中键单击最终与左键单击相同.

为什么会这样？是因为他们为点击事件编程功能,并且错误地将其应用于所有点击而不是仅仅点击左键？

通过明确地给中间点击行为解决了问题吗？或者通过使现有的点击行为代码更加狭窄地应用？

给出以下HTML:

<div contenteditable="true">Some text</div>

还有一些用JQuery检测click事件的JS:

$("div").click(function() {
   alert('click!');
});

如果您选择div中文本的一部分,Opera 将不会抛出click事件(在Linux上使用Opera 11.61和在Windows上使用11.62进行测试).双击一个单词以对其进行部分标记确实有效.

本次活动是在IE7-9,火狐,Chrome和Safari抛出.这里有一个稍微修改过的JSFiddle.

这是预期的行为,JQuery错误,Opera错误还是其他什么？

我发生了一些e.stopPropagation()事件,以防止点击冒出某些元素.但现在似乎每次我点击这些页面上的任何内容,除了这些元素,我在控制台中收到此错误:

Uncaught TypeError: ((m.event.special[e.origType] || (intermediate value)).handle || e.handler).apply is not a function

我很确定它与stopPropagation()处理程序有关,但是我如何准确地解决这个问题,我需要stopPropagation()这些元素上的函数才能使这些函数正确地在前端工作.

这是我目前正在使用的js代码:

var mainMenu = $(".menuMain");

if (mainMenu.length) {
    var clonedMain = mainMenu.clone(true, true),
        baseLogo = clonedMain.find('.logoMenu').find('.base-logo'),
        scrollLogo = clonedMain.find('.logoMenu').find('.scroll-logo');

    clonedMain.addClass('scroll-menu').addClass('hidden');
    baseLogo.addClass('hidden');
    scrollLogo.removeClass('hidden');
}

// Bootstrap Menu Dropdowns:
$('ul.menu-bootstrap-menu').on('click', '.dropdown-menu', function(event) {
    event.preventDefault(); 
    event.stopPropagation(); 
    $(this).parent().siblings().removeClass('open');
    $(this).parent().toggleClass('open');
});

$('.dropdown').on('click', '.dropdown-toggle', function(e) {
    e.stopPropagation();

   var $this = $(this);
   var $li = $this.closest('li.dropdown');

   $li.siblings().removeClass('open');
   $li.siblings().find('a').removeClass('dropdown-overlay').children('.caret-arrow').hide();
   if ($li.hasClass('open'))
   {
        $li.removeClass('open');
        $this.removeClass('dropdown-overlay').children('.caret-arrow').hide();
   }
   else
   {
        // …

我正在开发一个项目,我想在页面中添加同一个类的许多元素,并使所有这些类可以访问$('selector').click(); 事件处理程序 然而,正在发生的事情是,同一类的动态添加元素都没有响应点击.

为了让你更好地了解我的意思,我编写了一个示例jsFiddle,它与我项目中的实际问题非常相似:

链接到jsFiddle:http://jsfiddle.net/8LATf/3/

• 类"added_element"的一个元素在加载时已经在页面上.此元素是可单击的.

• 单击一个按钮,它会使用append动态地将类"added_element"的其他元素添加到页面中.这些元素都不可点击.

如何使"added_element"类的所有元素都可以点击？我猜它与我在事件处理程序中使用的选择器有关,但我无法弄明白.

任何帮助深表感谢!!!

我动态添加了多个 div。类名以“result_”+id 形式给出，其中 id 来自数据库表。

<div class="result_137">Gaurab Dahal</div>
<div class="result_138">saurab dahal</div>

我如何编写点击事件，以便它可以为点击它的 div 添加地址。

例如，我可以编写如下的 css 来处理所有类名以字符串“result”开头的 div。

div[class^="result"]{
    padding:5px;
    width:490px;
    background: rgba(204,204,204,0.5);
    font: 12px arial, verdana, sans-serif;
}

禁用元素，例如<select>并且<input>对 click 事件没有反应，我试图将它们包装在 a 中<div>并收听它的 click 事件。

单击禁用<input>会触发单击它的容器<div>，但我遇到了<select>元素问题。单击禁用的<select>元素不会触发它的容器<div>单击，正如您在此JSFiddle 示例中所见。

html：

<button onclick="buttonClick()" >Click</button>
<div id="test"></div>

js：

buttonClick = function (){
    var editor = $("#test");

    var div=$("<div>")
      .mousedown(function () {
          alert("!!!");
        })
      .appendTo(editor);

     var selecttest = $("<select>")
      .attr("disabled", "disabled")
      .appendTo(div);
     $("<option />").attr("value", '').appendTo(selecttest);
};

如果我<input>使用以下代码而不是添加<select>，它会起作用：

 var textinput = $("<input>")
      .attr("type", "text")
      .attr("disabled", "disabled")
      .appendTo(div);

针对不同的浏览器测试：对于IE11：两个input和 …