How to disable `tappable` effect



  • Hello,

    If I use tappable attribute for ons-list-item - all area of the list item will have tappable effect.
    But how I can to disable this effect for some internal objects?
    For example if I have button inside ons-list-item

    <ons-list>
      <ons-list-item tappable>
        <div class="center">
          Item1
        </div>
        <div class="right">
          <ons-button>Settings</ons-button>
        </div>
      </ons-list-item>
    </ons-list>
    

    In this case tappable effect is appeared for all item if I click on the button. How I can to disable this behavior?

    Yes, I know about event.stopPropagation() but in this case I have to use this method for 6 events in the ons-button - onmousedown, onmouseup, onclick, ontouchstart, ontouchend, ontap?
    Maybe you can suggest more easy way?



  • Any ideas?


Log in to reply