相关疑难解决方法(0)

我有一些代码,我循环遍历页面上的所有选择框,并将.hover事件绑定到它们,以便在它们的宽度上做一些麻烦mouse on/off.

这发生在页面准备就绪并且工作得很好.

我遇到的问题是,我在初始循环后通过Ajax或DOM添加的任何选择框都不会受到事件限制.

我找到了这个插件(jQuery Live Query Plugin),但在我用插件添加另外5k到我的页面之前,我想知道是否有人知道这样做的方法,无论是直接使用jQuery还是通过其他选项.

我正在尝试将新DOM对象附加到某个Div并且它可以工作,但不知何故 - 我为这些新附加对象编写的事件没有响应.这是为什么？

我在这里附上一个简单的例子:点击段落应该隐藏的任何段落.然而,对于使用.append添加的段落,它不起作用.

http://jsfiddle.net/xV3HN/

有我的代码:

$(document).ready(function(){

$("#add").click(function(){
     $("#containerDiv").append("<p> I should hide as well if you click me </p>");
  });

 $("p").click(function(){
     $(this).hide();
  });

});

为什么我不能抓住这个<a>......

<a href="javascript:void(0)" class="select2-choice select2-default" tabindex="-1">
   <span class="select2-chosen">select item</span>
   <abbr class="select2-search-choice-close"></abbr>
   <span class="select2-arrow">
      <b></b>
   </span>
</a>

...用这个jQuery？

$(document).ready(function() {
     $( ".select2-choice" ).click(function() {
     alert( "Handler for .keydown() called." );
     });
});

我认为这是产生下拉列表的功能:

        createContainer: function () {
        var container = $(document.createElement("div")).attr({
            "class": "select2-container"
        }).html([
            "<a href='javascript:void(0)' onclick='return false;' class='select2-choice' tabindex='-1'>",
            "   <span class='select2-chosen'>&nbsp;</span><abbr class='select2-search-choice-close'></abbr>",
            "   <span class='select2-arrow'><b></b></span>",
            "</a>",
            "<input class='select2-focusser select2-offscreen' type='text'/>",
            "<div class='select2-drop select2-display-none'>",
            "   <div class='select2-search'>",
            "       <input type='text' autocomplete='off' autocorrect='off' autocapitalize='off' spellcheck='false' class='select2-input'/>",
            "   </div>",
            " …

http://jsfiddle.net/YsnhT/2/

追加后Jquery事件开启不起作用.单击"保存"按钮后,我需要textarea的值.

$('.span8')
    .on('click',
            '.btn',
            function() {
        var input = $("#textarea").val();
        alert(input);
    });

$('body').on('click','#createNote',function() {                $('.span8').empty();
                $('.span8').append('<button type="button" class="btn" style="float: right; margin-right: 8px;background-color:#dddddd;font-family:Roboto Slab;color: black" id="save" data-loading-text="Saving...">Save</button><div class="hero-unit"><input type="text" style="width: 100%" id="title" placeholder="Title"/>'+ 
                '<textarea contenteditable="true" id="textarea" class="textarea" placeholder="Enter text ..."style="width: 100%;">dd</textarea></div>');

            });

HTML:

<div class="span8"></div>

这是我写的脚本.第一个单击功能工作正常,但其他两个不能按预期工作.标签遵循href链接,其单击功能不起作用.是因为它们是由jQuery创建的,而不是在原始的html页面中？

$("#edit-description").click(function(){
    $("#add-description").replaceWith( "<div id='add-description'><textarea cols='43' rows='9' placeholder='Add a description...'></textarea><a href='#' class='u-update'>Update</a><a href='#' id='add-description-cancel'>Cancel</a></div>" );
    return false;
  }); 

  $("#add-description-cancel").click(function(){
    $("#add-description").replaceWith( '<div id="add-description">Write a <a href="/#" id="edit-description">description</a> about the college.</div>');
    return false;
  }); 

  $(".u-update").click(function(){
    $("#add-description").replaceWith( '<div id="add-description">Write a <a href="/#" id="edit-description">description</a> about the college.</div>');
    return false;
  }); 

ttI有两个这样的功能:

function fn1() {
    $(".element").append("<div class='trigger'></div>");
}

function fn2() {
    $(".element").append("<div class='trigger'></div>");
}

和一个听众:

$(".trigger").click(function() {
    // do some magic with $(this) element
});

问题是如果click事件侦听器位于fn1和fn2之外,则它不会看到何时单击动态创建的元素(触发器).

如何让事件监听器全局监听？

当我<select id="myid" >从我的服务器加载来自ajax的Element时.这个选择器没有工作.但是,当我把这个代码放在html而不是由Ajax加载时,这个选择器运行良好......

$('#myid').change(function(){
  alert('OK!');
});

<select id="myid" >
 <option>1</option>
 <option>2</option>
 <option>3</option>
</select>

如何解决这个bug？

我有一个选定的公司列表,如下所示:

<div id="selected_companies">
    <div class="company">
      <a>
        <div class="delete_company"></div>
        Company One
      </a>
    </div>
    <div class="company">
      <a>
        <div class="delete_company"></div>
        Company Two
      </a>
    </div>
</div>

我希望在点击其中一家公司时将每个.companydiv "移动" 到一个单独的#deleted_companiesdiv中.我用jQuery做这个:

$('#selected_companies .company a').on('click', function (e) {
        /* Getting the company */
        var company_id = $(this).prev().prop('value');
        $('.form').append('<input type="hidden" name="deleted_companies[]" value="'+ company_id +'" />');

        var parent = $(this).parent();

        parent.appendTo('#deleted_companies');
        $('#deleted_companies').slideDown(300);
});

当我点击其中一个公司时,.companydiv移动到所需的div(#deleted_companies),但是当我尝试在该div中达到它时,它没有按预期执行.例如,此代码不起作用:

$('#deleted_companies .company a').on('click', function (e) {
    alert('This should work.');
});

那么如何使该警报工作？

我在jQuery/HTML5中有一个简单的前端(+后端生成的代码,它没有带来问题,所以我将省略它).当前使用的jQuery版本是1.8.3并且不存在版本冲突(即没有加载其他jQuery版本 - 它在其他系统中发生了很多次).

前端调用以下例程:

detailAjaxCall("\/client\/orders\/detailsLoad\/id\/3");

$(".upLink").click(function(){
    console.log("subiendo");
    var id = $(this).closest("tr").data('detail-id');
    var url = "\/client\/orders\/detailMoveUp" + "/id/" + id;
    detailAjaxCall(url);
    return false;
});

$(".downLink").click(function(){
    console.log("bajando");
    var id = $(this).closest("tr").data('detail-id');
    var url = "\/client\/orders\/detailMoveDown" + "/id/" + id;
    detailAjaxCall(url);
    return false;
});

$(".delLink").click(function(){
    console.log("borrando");
    var id = $(this).closest("tr").data('detail-id');
    var url = "\/client\/orders\/detailDelete" + "/id/" + id;
    detailAjaxCall(url);
    return false;
});

注意:url字符串没有格式错误.它们是由json导出器生成的(这一段代码是从view sourceGoogle Chrome浏览器中的选项中提取的).评估它们中的任何一个都将返回一个没有反斜杠的字符串.

在detailAjaxCall("/client/orders/detailsLoad/id/<number>")实际工作:它返回预期的JSON代码,当我打的网址,并呈现此时,相应的表项:

function detailAjaxCall(url)
{
    $.get(
        url,
        {},
        function(data, status, xhr) {
            //todo refrescar(data); …

所以我有一堆我想要点击的游戏.如果我向按钮添加一个单击功能,我会得到所需的结果,但是当我将它添加到游戏块类时,它无法工作.

这是一个在jsfiddle上正常工作的例子,但是当我在我的脚本中使用它时不是这样:http: //jsfiddle.net/sLt7C/

这是我想在我的页面上做的事情:

$('.gamePiece').click(function(){
    $('.gamePiece').addClass("toggled");
});

这不起作用,但如果我将标识符切换到页面上的按钮,它确实有效:

$('#btn_AddClass').click(function(){
    $('.gamePiece').addClass("toggled");
});

什么可能导致这失败？

不确定这是否会对导致其失败的因素产生任何影响,但"游戏片段"是单击"新游戏"按钮后生成的跨度元素.

这是一个小提示,显示更多代码http://jsfiddle.net/sLt7C/4/

进一步澄清:

这不起作用

$('.gamePeice').click(function(){
    $(this).addClass("toggled");
});

这有效

$('#btn_addClass').click(function(){
    $('.gamePeice').addClass("toggled");
});