jquery - Datatable 中的单选按钮无法在 Safari/Firefox 中呈现

标签 jquery html css

我的 html 文件有问题。 我在页面中有一个数据表,表中的每一行都有一列,其中包含两个单选按钮。应始终选择一个单选按钮。

现在的问题是在 IE8 下一切正常,但是当我切换到 IE9+/Safari/FireFox 时,表格中的第一对单选按钮似乎没有被选中。我检查了源代码,它确实告诉了

<input type="radio" checked  name="radio_10" onchange="chgRadio('aaa','2')" value="2"></input>
<input type="radio" name="radio_10" onchange="chgRadio('aaa','1')" value="1"></input>

所以有点奇怪为什么选中的按钮无法在页面上呈现?

这里我附上了这个html文件的源代码,在代码中我在javascript中包含了一个jquery文件,一旦我删除了这个文件,即使在Safara/Firefox下,所有的单选按钮也可以正确呈现。 所以我只是想知道这是关于 jquery 和浏览器版本之间的兼容性问题吗?在 css 中做一些更改是否有帮助?

<!DOCTYPE html>
<html>
<head>

 <meta charset="utf-8">

  <link href="jquery/ui/css/sunny/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css">

<link href="jquery/datatables/css/mrbs-page.css" rel="stylesheet" type="text/css">
<link href="jquery/datatables/css/mrbs-table.css" rel="stylesheet" type="text/css">
<link href="jquery/datatables/css/ColReorder.css" rel="stylesheet" type="text/css">
<link href="jquery/datatables/css/ColVis.css" rel="stylesheet" type="text/css">

<link rel="stylesheet" href="css/mrbs.css.php" type="text/css">
    <link rel="stylesheet" media="print" href="css/mrbs-print.css.php" type="text/css">
<!--[if IE]>
<link rel="stylesheet" href="css/mrbs-ie.css" type="text/css">
<![endif]-->
    <!--[if IE 8]>
<link rel="stylesheet" href="css/mrbs-ie8.css" type="text/css">
<![endif]-->
<!--[if lte IE 8]>
<link rel="stylesheet" href="css/mrbs-ielte8.css" type="text/css">
<![endif]-->
<!--[if lte IE 7]>
<link rel="stylesheet" href="css/mrbs-ielte7.css.php" type="text/css">
<![endif]-->
<!--[if lte IE 6]>
<link rel="stylesheet" href="css/mrbs-ielte6.css" type="text/css">
<![endif]-->

<meta name="robots" content="noindex">

<script type="text/javascript" src="jquery/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery/ui/jquery-ui-1.8.22.custom.min.js"></script>
<script type="text/javascript" src="jquery/ui/jquery-ui-i18n.js"></script>
<script type="text/javascript" src="jquery/ui/jquery-ui-datepicker-en.js"></script>
<script type="text/javascript" src="jquery/ui/jquery-ui-datepicker-en-US.js"></script>

<script type="text/javascript">
//<![CDATA[
var lteIE6 = false;
//]]> 
</script>
<!--[if lte IE 6]>
<script type="text/javascript">
//<![CDATA[
var lteIE6 = true;
//]]>
</script>
<![endif]-->

<script type="text/javascript">
//<![CDATA[
var lteIE7 = false;
//]]>
</script>
<!--[if lte IE 7]>
<script type="text/javascript">
//<![CDATA[
var lteIE7 = true;
//]]>
</script>
<![endif]-->

<script type="text/javascript">
  //<![CDATA[
  var lteIE8 = false;
  //]]>
</script>
<!--[if lte IE 8]>
<script type="text/javascript">
  //<![CDATA[
  var lteIE8 = true;
  //]]>
</script>
<![endif]-->

<script type="text/javascript">
  //<![CDATA[
    function init(params)
  {
  }
</script>

  <script type="text/javascript" src="jquery/datatables/js/jquery.dataTables.min.js"></script>
  <script type="text/javascript" src="jquery/datatables/js/ColReorder.min.js"></script>
    <script type="text/javascript" src="jquery/datatables/js/ColVis.mrbs.min.js"></script>
    <script type="text/javascript" src="jquery/datatables/js/FixedColumns.mrbs.js"></script>
  <script type="text/javascript" src="jquery/datatables/js/plugins.js"></script>

  <script type="text/javascript" src="js/datatables.js.php?area="></script>

    <script type="text/javascript" src="js/edit_users.js.php?area="></script>
  <script type="text/javascript" src="js/functions.js.php?area="></script>
<script type="text/javascript" src="js/datepicker.js.php?area="></script>
<script type="text/javascript" src="js/general.js.php?area="></script>


</head>

<body class="non_js edit_users">
<script type="text/javascript">
  //<![CDATA[
  $('body').addClass('js').removeClass('non_js');
  //]]>
</script> 

<div id="contents">
<script type="text/javascript">
       var changes = new Array();
       function delConfirm(id,name) {
          var r = confirm("Are you sure to delete user "+name+" ?");
          if (r)
               window.location="edit_users.php?Action=Delete&Id="+id;
        }
       function delAlert(){
          alert("This is the last admin in the system, you cannot delete it!")
       } 
       function chgRadio(name,role){
             var group = new Array();
             var exist = false;
             for(i=0;i<changes.length;i++){
                  if(changes[i][0]==name){
                       changes[i].push(role==1?"user":"admin");
                       exist = true;
                   }
             }
             if (!exist){  
                group.push(name,role==1?"user":"admin");
                changes.push(group);
             }
       }
       function chgConfirm(Action){
             var makechg = false;
             if (changes.length==0){
                   var s="No users selected to change roles.";
             }
             else {
                var s="Change\n";
                for (i=0; i<changes.length; i++) { 
                   var name= changes[i];
                   if(name.length == 2){
                         s+=name[0]+" to be "+name[1]+"\n";
                         makechg=true;
                   }
                   else{
                         if(changes.length==1) {
                            if(name[1]!=name[name.length-1]){
                                s="No users selected to change roles";
                                continue;
                             }
                             else{
                                 s+=name[0]+" to be "+name[name.length-1]+"\n";
                                 makechg=true;
                             } 
                          }
                         else{
                            if(name[1]!=name[name.length-1]){
                                continue;
                             }
                             else{
                                 s+=name[0]+" to be "+name[name.length-1]+"\n";
                                 makechg=true; } 
                         }
                      }
                  }
             }
             if (!makechg){
                   alert(s);
                   return false;
             }
             else {
                 var r = confirm(s);
                 if (r)
                      document.location.reload(true);
                 else{
                      document.getElementById("Action").value="nochg";
                      document.location.reload(true);
                 }
             }
       }
       </script><br><br><h1 align="center">User list</h1>
<form id="form_user_list" class="form_user_list" name = "form_user_list" method="post" 

action="edit_users.php">
<div id="user_list" class="datatable_container">
<table class="admin_table display" id="users_table">
<thead>
<tr>
<th rowspan="2">Name</th>
<th colspan="2">Current Role</th><th rowspan="2" width="50">Delete User</th>
</tr>
<tr><th width="80">Admin</th>
<th width="80">User</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<a title="igor">igor</a></td>
<td><div><input type="radio" checked  name="radio_10" onchange="chgRadio('igor','2')" value="2"></input></td>
<td><input type="radio" name="radio_10" onchange="chgRadio('igor','1')" value="1"></input></div></td>
<td><img src="images/delete.png" width="16" height="16" alt="Delete" title="Delete" onclick="delConfirm('10','igor')"></a>
</td>
</tr>
<tr>
<td>
<a title="nate">nate</a></td>
<td><div><input type="radio" checked  name="radio_9" onchange="chgRadio('nate','2')" value="2"></input></td>
<td><input type="radio" name="radio_9" onchange="chgRadio('nate','1')" value="1"></input></div></td>
<td><img src="images/delete.png" width="16" height="16" alt="Delete" title="Delete" onclick="delConfirm('9','nate')"></a>
</td>
</tr>
<tr>
<td>
<a title="shahm6">shahm6</a></td>
<td><div><input type="radio" checked  name="radio_4" onchange="chgRadio('shahm6','2')" value="2"></input></td>
<td><input type="radio" name="radio_4" onchange="chgRadio('shahm6','1')" value="1"></input></div></td>
<td><img src="images/delete.png" width="16" height="16" alt="Delete" title="Delete" onclick="delConfirm('4','shahm6')"></a>
</td>
</tr>
<tr>
<td>
<a title="test">test</a></td>
<td><div><input type="radio" checked  name="radio_11" onchange="chgRadio('test','2')" value="2"></input></td>
<td><input type="radio" name="radio_11" onchange="chgRadio('test','1')" value="1"></input></div></td>
<td><img src="images/delete.png" width="16" height="16" alt="Delete" title="Delete" onclick="delConfirm('11','test')"></a>
</td>
</tr>

最佳答案

。尝试删除第一个单选按钮中选中的单词。尝试测试它是否有效。因为我无法理解你想要表达的想法,因为你没有包含它的链接,比如 jsfiddle.net ..

快乐编码...

关于jquery - Datatable 中的单选按钮无法在 Safari/Firefox 中呈现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15103068/

相关文章:

javascript - jquery 禁用上一个下一个按钮模态图像

javascript - 如何使 j-query 照片库 slider 与重复 slider 配合得很好?

javascript - 我可以使用 JavaScript 删除 HTML 代码中的一行吗?

javascript - 带有 HTML 下拉选项的 jquery 克隆 两个下拉菜单选择相同的值,警报应选择不同的值

html - 使用 colspan 时如何修复填充 Twitter Bootstrap 单元格表

javascript - Bootstrap 按钮仅适用于 jfiddle,不适用于网页

IE 中的 jQuery 数据表优化,96.7% 的时间花在 offsetWidth 上

jquery - 如何在我的代码中实现 jquery.FloatThread 插件

javascript - 替换在触摸屏环境中工作的 Title 属性

javascript - 在页面顶部添加特定类到滚动代码