none
能否用javascript动态生成并替换CSS样式 RRS feed

  • 问题

  • 在开始有个gridview指定了以下初始样式:CssClass="gridCSS"
    .gridCSS
    {
       table-layout: fixed;
     }

    当有了内容后,我想在前台事件里用javascript的函数根据用户搜索的内容重新分别指定每列的列宽如 col 1 :60px,  col 2:120px, 并修改样式:
    {
      overflow:hidden;
      cursor:default; white-space:nowrap;
      text-overflow:ellipsis;
    }

    2009年11月17日 8:20

答案

  • 可以

    document.getElementById("<%=GridView1.ClientID%>").className="newClass"

    【孟子E章】
    • 已标记为答案 scate233 2009年11月18日 3:27
    2009年11月17日 9:13
    版主
  • document.getElementById('YourElementId').style.width = '200px';
    知识改变命运,奋斗成就人生!
    • 已标记为答案 scate233 2009年11月18日 3:27
    2009年11月17日 9:48
    版主
  • 不太明白你的意思 差不多这样
            var row = document.getElementById("<%=GridView1.ClientID%>");
                for (var i = 0; i < row.rows.length; i++) {
                    var coll = 1;
                    for (var c = 0; c < row.rows[i].cells.length; c++) {
                        var w = row.rows[i].cells[c].offsetWidth;
                        row.rows[i].cells[c].style.width = (w * coll) + "px";
                        coll++
                        alert(row.rows[i].cells[c].offsetWidth);
                    }           
                }
    • 已标记为答案 scate233 2009年11月18日 3:26
    2009年11月17日 9:56
  • document.getElementById("<%=GridView1.ClientID%>").rows[0].cells[0].style.width="10px"
    document.getElementById("<%=GridView1.ClientID%>").rows[0].cells[1].style.width="20px"
    【孟子E章】
    • 已标记为答案 scate233 2009年11月18日 3:26
    2009年11月17日 13:13
    版主

全部回复

  • 写在row创造事件里面控制列
    2009年11月17日 8:39
  • 可以

    document.getElementById("<%=GridView1.ClientID%>").className="newClass"

    【孟子E章】
    • 已标记为答案 scate233 2009年11月18日 3:27
    2009年11月17日 9:13
    版主
  • 可以

    document.getElementById("<%=GridView1.ClientID%>").className="newClass"

    【孟子E章】

    可怎么用js函数创建这个CSS?因为我先要在前台js函数里计算长度,然后才知道要定那些列要多长
    2009年11月17日 9:22
  • document.getElementById('YourElementId').style.width = '200px';
    知识改变命运,奋斗成就人生!
    • 已标记为答案 scate233 2009年11月18日 3:27
    2009年11月17日 9:48
    版主
  • 不太明白你的意思 差不多这样
            var row = document.getElementById("<%=GridView1.ClientID%>");
                for (var i = 0; i < row.rows.length; i++) {
                    var coll = 1;
                    for (var c = 0; c < row.rows[i].cells.length; c++) {
                        var w = row.rows[i].cells[c].offsetWidth;
                        row.rows[i].cells[c].style.width = (w * coll) + "px";
                        coll++
                        alert(row.rows[i].cells[c].offsetWidth);
                    }           
                }
    • 已标记为答案 scate233 2009年11月18日 3:26
    2009年11月17日 9:56
  • document.getElementById("<%=GridView1.ClientID%>").rows[0].cells[0].style.width="10px"
    document.getElementById("<%=GridView1.ClientID%>").rows[0].cells[1].style.width="20px"
    【孟子E章】
    • 已标记为答案 scate233 2009年11月18日 3:26
    2009年11月17日 13:13
    版主
  • 是这样的,用户进行搜索,在搜索后会调用前台的一个js函数,这个函数按照老板要求的方法,根据搜索结果来计算每列应该显示多宽,算好后,用js直接设定每列的列宽,同时使用新的CSS样式替换掉默认样式,列宽的调整和CSS的替换都是针对整个表格的
    2009年11月18日 2:06