Question

我在冒泡方面遇到了一些问题。我试过了event.stopPropagation（）;我在互联网上遇到过其他一些解决方案，但我无法让它发挥作用。

我有一个用于引导程序的主div，里面有一个表。我希望标题可以点击并打开一个模态，我还希望每一行都可以点击并打开一个不同的模态。所有上述元素都填充了jQuery.data（）对象，我想在模态中使用它们。即使我尝试event.stopPropropegation（），当我点击一行时（如预期的bubbeling），主div模式和模态函数都会触发。能不能指出我正确的方向，因为我不知道我做错了什么，我现在已经尝试了很多例子。这将是一个很大的帮助。谢谢。代码：

 var mainbody = $('<div class="panel panel-default" id="' + tableId1 + '">\
                <div class="panel-heading">\
                    <button type="button" class="close" onclick="AppObj.removeSystem(this);">&times;</button>\
                    System: ' + name + 
              ' </div>' +
               '<table id="' + tableId2 + '"class="systems table"><thead>\
                  <tr><th> Product </th><th> DryFilm thickness min </th><th> DryFilm thickness Avg. </th><th> DryFilm thickness max </th></tr></thead><tbody></tbody>\
                </table>\
             </div>');
// Here I've been trying alot of examples to stop the bubbeling
mainbody.click(function (e) {
e.stopPropagation();
e.preventDefault();
AppObj.editSystem(this);
console.log(e.target, this);
});

 // The clickable rows....
var row = $('<tr class="productrow" onclick="AppObj.editProduct(this);"><td class="productname" style="cursor: pointer;">' + showName + '</td><td class="dryfilmmin">' + dryFilmMin + '</td><td class="dryfilmavg">' + dryFilmAvg + '</td><td class="dryfilmmax">' + dryFilmMax + '</td></tr>')[0];
$.data(row, 'productinformation', {
    systemId: tableId1,
    rank: rank,
    product: i,
    dryFilmMin: dryFilmMin,
    dryFilmMax, dryFilmMax,
    dryFilmAvg: dryFilmAvg
});
mainbody.find('tbody').append(row)

我有一个传播的问题（bubbeling）

0 个答案: