无法识别输入单击

Input OnClick is not recognized

本文关键字:单击 输入 识别      更新时间:2023-09-26

我有这个递归调用的方法。

此方法创建一个将在 Iscroll 插件上使用的li

我的问题是:

input button不起作用。在他的 CSS 上,我设置了cursor:pointer来检查输入是否被识别,并且确实如此。但是我可以单击它几次,但什么也没做。

createList: function(p_id)
{
      var lv_linhaDoc = '<li id="lis_' + p_id + '" class="listItem">' +
        '<div class = "alinhar1" onClick="lis.Click(' + p_id + ', false)">' + 
            '<div class="ui-grid-a" style="font-size: large">' +
              '<div class="ui-block-a"><p class="header" style="font-size: medium"><strong>' + 4 + '</strong></p></div>' +
              '<div class="ui-block-a"><p class="line label"><strong>Data Criação</strong></p></div>' +
              '<div class="ui-block-b"><p class="line value" style="text-align: right">' + '13/2/14' + '</p></div>' +
              '<div class="ui-block-a"><p class="line label total"><strong>  Valor</strong></p></div>' +
              '<div class="ui-block-b"><p class="line total" style="text-align: right">' + 13 + ' ' + 15 + '</p></div>' +
          '</div></div>' +
          ' <input type="button" class=" button_add" onClick="lis.Detail(' + p_id + ')" />' +
      '</li>';
    return lv_linhaDoc;
},

问题不在于 Detail() 函数 ba因为我无法输入该函数,因为无法识别单击内容

更新

我发现input button在将这些添加到IScroll初始化后停止工作

click: true,
tap: true,

我真的需要IScroll中的这些参数来做其他功能。

IScroll 初始化:

initScroll: function(){
        var wrapper = document.getElementById('id5');
        myScroll = new IScroll(wrapper, {
//          click: true,
//          tap: true,
            scrollX : false,
            scrollY : true,
            scrollbars : false,
            interactiveScrollbars : true,
            mouseWheel : false,
            hScrollbar : false,
            vScrollbar : true,
            useTransition : false,
            snap : 'li',
            indicators : {
                el : '#scroller',
                fade : false,
                ignoreBoundaries : false,
                interactive : false,
                listenX : false,
                listenY : true,
                resize : false,
                shrink : false,
                speedRatioX : 0,
                speedRatioY : 0,
                checkDOMChanges: true,
            },
        });

您可以将p_id另存为输入的数据属性,然后使用事件委派设置单击处理程序,而不是尝试以内联方式添加单击处理程序。通过委派,您可以在稍后将动态创建的元素上设置处理程序。

创建列表项时,将p_id放在输入的数据属性中,例如 data-pid:

<input type="button" class="button_add" data-pid="' + p_id + '" value="+" />

然后添加委托给 .button_add 类的单击处理程序。在该处理程序中,您可以从 data-attribute 检索p_id:

$(document).on("click", ".button_add", function(e){
    var p_id = $(this).data("pid");
    alert(p_id);
    //call detail function and pass in the p_id
});

演示

你需要做如下的事情:

createList: function(p_id)
{
    var lis = new lisClass();
      var lv_linhaDoc = '<li id="lis_' + p_id + '" class="listItem">' +
        '<div class = "alinhar1" onClick="lis.Click(' + p_id + ', false)">' + 
            '<div class="ui-grid-a" style="font-size: large">' +
              '<div class="ui-block-a"><p class="header" style="font-size: medium"><strong>' + 4 + '</strong></p></div>' +
              '<div class="ui-block-a"><p class="line label"><strong>Data Criação</strong></p></div>' +
              '<div class="ui-block-b"><p class="line value" style="text-align: right">' + '13/2/14' + '</p></div>' +
              '<div class="ui-block-a"><p class="line label total"><strong>  Valor</strong></p></div>' +
              '<div class="ui-block-b"><p class="line total" style="text-align: right">' + 13 + ' ' + 15 + '</p></div>' +
          '</div></div>' +
          ' <input type="button" class=" button_add" onClick="lis.Detail(' + p_id + ')" />' +
      '</li>';
    return lv_linhaDoc;
},

你看我说var lis = new lisClass();

刚刚找到解决方案:

IScroll 上有一个错误,如果参数click已启用,则所有表单元素(例如提交按钮)都不适用于 iScroll。

所以,我这样做了:

myScroll = new IScroll(wrapper, {
            click: false,
            scrollX : false,
            scrollY : true,
            scrollbars : false,
            interactiveScrollbars : true,
            mouseWheel : false,
            hScrollbar : false,
            vScrollbar : true,
            useTransition : false,
            snap : 'li',
            preventDefaultException: {tagName:/.*/},
            indicators : {
                el : '#scroller',
                fade : false,
                ignoreBoundaries : false,
                interactive : false,
                listenX : false,
                listenY : true,
                resize : false,
                shrink : false,
                speedRatioX : 0,
                speedRatioY : 0,
                checkDOMChanges: true,
            },
        });

请注意,参数 click 现在false,我添加了preventDefaultException: {tagName:/.*/},

我在这里找到了这个