如何选择用户从跨度列表在javascript

how to select user from span list in javascript

本文关键字:列表 javascript 用户 何选择 选择      更新时间:2023-09-26

->我问的问题有点难以解释,所以请试着用开放的心态看待。

我正在制作一个phonegap应用程序,在这个应用程序中,我可以在本地sqlite数据库中注册一些用户。我可以把它们列个清单。我想要的是允许用户选中一个用户,并将该用户设置为活动用户(我想要显示它以某种方式被选中)。

这是我现在得到的(它不能选择它们):

HTML:

<span style="font-weight:bold;" class="TextUser">registered users:</span>
<span id="lbUsers"></span>

(现在它是垃圾邮件,但如果它更好,它可以是其他任何东西)

Javasctip:

function ListDBValues() {
if (!window.openDatabase) {
  alert('Databases are not supported in this browser.');
  return;
}
// this line clears out any content in the #lbUsers element on the
//page so that the next few lines will show updated
// content and not just keep repeating lines
$('#lbUsers').html('');
// this next section will select all the content from the User table
//and then go through it row by row
// appending the UserId  FirstName  LastName to the  #lbUsers element
//on the page
db.transaction(function(transaction) {
  transaction.executeSql('SELECT * FROM MyUsers;', [],
    function(transaction, result) {
     if (result != null && result.rows != null) {
       for (var i = 0; i < result.rows.length; i++) {
         var row = result.rows.item(i);
         $('#lbUsers').append('<p class="listOfUsers"> &nbsp;&nbsp;' + row.Name + '. ' + row.Email + '&nbsp;&nbsp; </p><br /><br /><br /><br />');
        }
      }
     },errorHandler);
},errorHandler,nullHandler);
return;
}
CSS:

.listOfUsers {
  position: absolute;
  margin: 2%;
  font-size: 15px;
  text-align: center;
  border:1px solid;
  border-radius:10px;
  left: 2%;
}

MyUsers有一个名为ActiveUser的BOOLEAN值(默认为FALSE)。我希望能够在列出的用户,并调用SetActiveUserDB函数(我可以通过参数发送或从选定用户的HTML id读取)

如果它更容易与一个按钮,将读取选定的用户,然后调用SetActiveUserDB它将为我工作。

谢谢。PS:

我肯定我没有解释清楚,所以请随时询问细节

可以为<p>元素添加一个click事件。

...
$('#lbUsers').append('<p class="listOfUsers"> &nbsp;&nbsp;' + row.Name + '. ' + row.Email + '&nbsp;&nbsp; </p><br /><br /><br /><br />');
// same code as above, now we add a click event to the item you just created.
$(".listOfUsers").last().click(function() {
    // remove selected class from any selected user.
    $(".listOfUsers.selected").removeClass("selected");
    // set this item to selected.
    $(this).addClass("selected");
});

工作示例:http://jsfiddle.net/dJNyk/5/