J'ai créé une application hybride dans laquelle j'ai utilisé bxslider et placé div à l'intérieur comme suit,
<div class="bxslider">
<div id="chart1" style="text-align:center">
<span id="barChartTitle">Bar Chart</span>
<svg id="chartCanvas" class="margintop40"></svg>
</div>
<div id="chart2" style="text-align:center">
<span id="trendChartTitle">Trend Chart</span>
<svg id="chartCanvas" class="margintop40"></svg>
</div>
</div>
chaque fois que je touche le bxslider dans la vue html, je reçois le message d'erreur suivant,
jquery.bxslider.js:1109 Uncaught DOMException: Failed to execute 'setPointerCapture' on 'Element': InvalidPointerId
at HTMLDivElement.onTouchStart (http://localhost:8100/js/jquery.bxslider.js:1109:34)
at HTMLDivElement.dispatch (http://localhost:8100/js/jquery-3.1.1.min.js:3:10315)
at HTMLDivElement.q.handle (http://localhost:8100/js/jquery-3.1.1.min.js:3:8342)
onTouchStart @ jquery.bxslider.js:1109
dispatch @ jquery-3.1.1.min.js:3
q.handle @ jquery-3.1.1.min.js:3
jquery.bxslider.js:1234 Uncaught DOMException: Failed to execute 'releasePointerCapture' on 'Element': InvalidPointerId
at HTMLDivElement.onTouchEnd (http://localhost:8100/js/jquery.bxslider.js:1234:32)
at HTMLDivElement.dispatch (http://localhost:8100/js/jquery-3.1.1.min.js:3:10315)
at HTMLDivElement.q.handle (http://localhost:8100/js/jquery-3.1.1.min.js:3:8342)
J'ai cherché beaucoup mais je ne pouvais pas savoir pourquoi l'erreur se produisait, aidez-moi s'il vous plaît.
Voici une solution de contournement qui fonctionne. Utilisez cet extrait de code:
var chromePointerEvents = typeof PointerEvent === 'function'; if (chromePointerEvents) { if (orig.pointerId === undefined) { return; } }
Insérer après:
touchPoints = (typeof orig.changedTouches !== 'undefined') ? orig.changedTouches : [orig];
du fichier jquery.bxslider.js
Plus d'infos ici lire la réponse de simplicitytrade sur Github .
pourquoi n'essayez-vous pas cette version actuelle?
<script src="https://cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.15/jquery.bxslider.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.15/jquery.bxslider.min.css" rel="stylesheet" />