I am using Phonegap, and trying to make a table whose rows are clickable.
My index.html file looks like:
<head>
...
</head>
<body>
<table id="daysOfWeek"></table>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
</body>
And js/index.js looks like:
var app = {
initialize: function() {
this.bindEvents();
},
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
onDeviceReady: function() {
var days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
days.forEach(function(day) {
var dayRow = $('<tr class="dayRow"></tr>');
$('#daysOfWeek').append(dayRow);
dayRow.append('<td>' + day + '</td>');
});
$('body').on('touchstart', '.dayRow', function() {
alert('table row clicked');
});
}
};
The issue is that, for some reason, only the last table row seems to detect the touch and produce the alert; touching the other table rows has no effect.
Any suggestions?
Thanks!
Aucun commentaire:
Enregistrer un commentaire