在< div class =“toolbar-inner”>点击事件框架7> < / DIV>但不在外面 [英] framework 7 on click event work at <div class=“toolbar-inner”> </div> but not outside

问题描述

html code

 < div class =toolbar toolbar-bottomid => 
< div class =myProgress2id =myProgress2style =background-color：grey; width：100px; margin-left：10px> 
< div id =myBar2class =myBar2style =width：3％; height：10px; background-color：white;>< / div> 
< / div> 
< div class =toolbar-inner> 
< div class =myProgress2id =myProgress2style =background-color：grey; width：100px; margin-left：10px> 
< div id =myBar2class =myBar2style =width：3％; height：10px; background-color：white;>< / div> 
< / div> 
< / div> 
  

查看上面的代码作为图像。使用相同的代码，但在最顶级的div onclick不工作和bellow div onclick工作
$ b $ js（框架7）代码

$（'。c code> $$（'。myProgress2'）。on（'click'，function（e）{
myApp.alert（'tab'）;
}） ;

我也尝试使用jquery函数normal js事件侦听器。我得到了同样的结果。请帮助我

解决方案

div>

必须遵循工具栏底部的类toolbar-inner div。

 < div class =toolbar toolbar-bottom tabbar-scrollable bottom-navstyle =背景：＃a3194c; box-shadow：none;> 
< div class =toolbar-inner> 
< div class =myProgress2id =myProgress2style =background-color：grey; width：100px; margin-left：10px> 
< div id =myBar2class =myBar2style =width：3％; height：10px; background-color：white;>< / div> 
< / div> 
 
< div class =myProgress2id =myProgress2style =background-color：gray; width：100px; margin-left：10px> 
< div id =myBar2class =myBar2style =width：3％; height：10px; background-color：white;>< / div> 
< / div> 
< / div> 
< / div> 
  

您编写div的方式将被视为不可用于DOM的伪元素。

html code

    <div class="toolbar toolbar-bottom" id="">
<div class="myProgress2" id="myProgress2" style="background-color: grey; width:100px;margin-left: 10px">
    <div id="myBar2" class="myBar2" style="width: 3%;height: 10px;background-color:white;"></div>
</div>
<div class="toolbar-inner">
    <div class="myProgress2" id="myProgress2" style="background-color: grey; width:100px;margin-left: 10px">
        <div id="myBar2" class="myBar2" style="width: 3%;height: 10px;background-color:white;"></div>
    </div>
</div>

Look At above code as well as image. use same code but at top most div onclick not working and bellow div onclick working

js (framework 7) code

$$('.myProgress2').on('click', function (e) {
    myApp.alert('tab');
});

i also try with jquery function normal js event listener. i got same result. please help me

解决方案

After toolbar-bottom class toolbar-inner div must be followed. like the one give below.

<div class="toolbar toolbar-bottom tabbar-scrollable bottom-nav" style="background: #a3194c;box-shadow:none;">
    <div class="toolbar-inner">
        <div class="myProgress2" id="myProgress2" style="background-color: grey; width:100px;margin-left: 10px">
            <div id="myBar2" class="myBar2" style="width: 3%;height: 10px;background-color:white;"></div>
        </div>

        <div class="myProgress2" id="myProgress2" style="background-color: grey; width:100px;margin-left: 10px">
            <div id="myBar2" class="myBar2" style="width: 3%;height: 10px;background-color:white;"></div>
        </div>
    </div>
</div>

The way you have written the div will be considered as pseudo-element which is not available for DOM.

这篇关于在< div class =“toolbar-inner”>点击事件框架7> < / DIV>但不在外面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！