Question

我绝对不知道如何更改此代码以冻结第一列。我不知道班级名称，因为我的表是用我的用户输入自动创建的......

我知道我应该添加

    <style> <\style>

但我不知道在里面写什么......

感谢您的回答

  <title>Table Layout</title>
</head>

<body>
  <div id="myTable"></div>
  <script>

    var delimiter = ",";
    var urlArray = window.AppInventor.getWebViewString().split("\n");
    var urlArray = location.search.slice(1).split("/n");

    var doc = document;
    var fragment = doc.createDocumentFragment();
    var thead = doc.createElement("thead");
    var tr = doc.createElement("tr");

    var rowArray = urlArray[0].split(delimiter);

    addRow(thead, "th");
    fragment.appendChild(thead);

    var tbody = doc.createElement("tbody");
    for(i=1;i<urlArray.length;i++){
      var tr = doc.createElement("tr");

      // split at delimiter
      var rowArray = urlArray[i].split(delimiter);

      tr.addEventListener ("click", function () {
        // return index (add 1 because first row is the header row)
        //window.document.title = this.rowIndex + 1;
        window.AppInventor.setWebViewString(this.rowIndex + 1);
      });

      addRow(tbody, "td");
    }
    fragment.appendChild(tbody);
    var table = doc.createElement("table");
    table.appendChild(fragment);
    doc.getElementById("myTable").appendChild(table);

    // http://stackoverflow.com/a/9236195/1545993
    doc.getElementById("myTable").getElementsByTagName('table')[0].className = "striped";


    function addRow(dom, tag) {
      for(j=0;j<rowArray.length;j++){
        var el = doc.createElement(tag);
        el.innerHTML = rowArray[j];
        tr.appendChild(el);
        dom.appendChild(tr);
      }
    }
  </script>
</body>
</html>

Answer 1

要修复元素，position: fixed;会帮助你解决这个问题：

tr:nth-child(1) { /** <- Select the first tr tag */
  background-color: red; /** <- This is just to show the effect */
  position: fixed; /** <- This is to make it stay where it is */
}

<table >
	<tbody>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
    <tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
    <tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
    <tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
    <tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
		<tr>
			<td>Stuff </td>
			<td>Stuff </td>
		</tr>
	</tbody>
</table>

冻结列HTML JavaScript

1 个答案: