Ajax-php-mysql-checkbox

我正在尝试创建一个带有复选框的动态系统，用于我正在尝试使用Ajax、PHP和MYsql制作的基于web的游戏

是否有一种可能的方法可以检测何时选中/取消选中复选框，从数据库中提取信息，并根据用户的选择在网站上动态显示信息，而无需刷新整个页面

到目前为止我已经得到了这个

我的表单由PHP从如下数据库呈现：

   <form method="POST" action=""> 
<table cellspacing = 6 cellpadding = 2 >
        <tr bgcolor=#dce3b5>
            <td><b>Select &nbsp;&nbsp;</b></td>
            <td><b>Country</b></td>
            <td><b>Player Name</b></td>
            <td><b>Points</b></td>
            <td><b>Total Points</b></td>
            <td><b>Season Rank</b></td>
            <td><b>Cost</b></td>            
        </tr>
 while($row = mysql_fetch_array($result))
  {
  $name = $row['Pname'];
  $PHM = $row['PHM'];
  $nation = $row['nation'];
  echo '<tr>';
  echo '<td>'.'<input type="checkbox" name="team[]" value= "'.$name.'" onClick ="showUser(this.value)">'.'</td>';
  echo'<td>'.$nationf.'</td>';  
  echo '<td>'."$name".'</td>';
  echo '<td>'."$row[points]".'</td>';
  echo '<td>'."$row[tpoints]".'</td>';
  echo '<td>'."$row[seriesrank]".'</td>';
  echo '<td>'."$row[PHM]".'</td>';
  echo  '</tr>';
}

在上面的代码中

此代码的javascript组件是：

<script type="text/javascript">

var xmlhttp;

function showUser(str)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
  {
  alert ("Browser does not support HTTP Request");
  return;
  }
var url="getuser.php";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}

function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}

function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
  {
  // code for IE7+, Firefox, Chrome, Opera, Safari
  return new XMLHttpRequest();
  }
if (window.ActiveXObject)
  {
  // code for IE6, IE5
  return new ActiveXObject("Microsoft.XMLHTTP");
  }
return null;
}


</script>

然后我用这个来显示动态元素

<div id="txtHint"><b>Changing element goes here.</b></div>

更改元素将转到此处。

基本上，一定数量的钱与我数据库中的一个名称相关联，我用一个复选框来选择这些名称

例如： 鲍勃-->100 罗伯-->200 南希-->300 罗恩-->50岁 杰克-->30岁

如果我选中Bob和Rob，动态元素应该是300，如果我取消选中Rob，它应该在我不按submit按钮的情况下变为100

到目前为止，它显示了与我上次单击的复选框关联的钱。。。我不知道如何检测所有选中的复选框

---

如果有人能帮我，那就太好了。。。提前感谢：）

我认为您在不使用任何库的情况下实现这一点是令人钦佩的，但我真的认为您可以通过做几件事来节省大量时间和麻烦

首先，使用来处理AJAX和DOM选择工作。了解引擎盖下的工作原理是很好的，但我认为，如果你不在自己和众多浏览器不兼容之间使用某种抽象层，将来你只会给自己带来各种各样的心痛

第二，在PHP领域，我认为PHP和HTML不应该混合使用。这是一个很大的原因，我的意思是，PHP受到如此恶劣的评价，让人们像的眼睛流血。它变得难以管理，难以阅读。使用某种模板（比如现在孩子们正在使用的模板）来分离视图和控制器代码

第三，获取URL参数并将其直接放入查询中，这是绝对不应该做的。我并不自称是安全专家，但这看起来是一个相当严重的问题——潜在的

最后，回答你的问题：

如果你需要做的只是在用户选中一些复选框时加上一些值，那么我会将复选框的值设置为实际的美元金额（而不是名称），然后在用户单击复选框时加起来。如果您使用的是jQuery，它将如下所示：

// bind to the click event on all checkboxes
$('input[type=checkbox]').click(function(){   
    // for each checked box, total up all the values 
    var total = 0
    $('input:checked').each(function(){
       total += parseInt($(this).val());
    });

    // display that total in the hint field you mentioned.
    $('#txtHint').val(total);
});

它不需要访问服务器。这就是说，如果你真的要把计算出的数量拿出来，做一些事情，而不仅仅是向用户展示，那么这可能不是一个好主意。此外，在示例代码中没有进行错误检查，因此应该将其视为一个想法，而不是最终产品

<div id="txtHint"><b>Changing element goes here.</b></div>

// bind to the click event on all checkboxes
$('input[type=checkbox]').click(function(){   
    // for each checked box, total up all the values 
    var total = 0
    $('input:checked').each(function(){
       total += parseInt($(this).val());
    });

    // display that total in the hint field you mentioned.
    $('#txtHint').val(total);
});