Question

所以这是我的完整代码，我尝试使用html表连接数据库，并且我想用表中的数据更改输入类型的值：

<div class="thank-outer" id="thankyou">
       Some text
    </div>

有没有办法使用javascript来更改与点击行匹配的这3种输入类型的值？

P.S：抱歉英文不好

Answer 1

试试这个， HTML代码

<table id="data" border="1" style="margin-top:50px" align="center"> 
<caption align="center">Tabel Data Mahasiswa</caption>
<tr style="text-align:center">
<strong>
<th width="150px">NIM</th>
<th width="250px">Nama</th>
<th width="250px">Jurusan</th>
</strong>
</tr>
<tr onclick="settext(this.rowIndex)">
<td>1</td>
<td>Data2</td>
<td>Data3</td>
</tr>
<tr onclick="settext(this.rowIndex)">
<td>4</td>
<td>Data5</td>
<td>Data6</td>
</tr>

</table>
<input type="number" id="fordata1">
<input type="text" id="fordata2">
<select id="fordata3" style="width:173px" >

</select>

的Javascript

function settext(x){
var table = document.getElementById('data');
var a = table.rows[x].cells[0].innerHTML;
var b = table.rows[x].cells[1].innerHTML;
var c = table.rows[x].cells[2].innerHTML;
document.getElementById('fordata1').value = parseInt(a);
document.getElementById('fordata2').value = b;
document.getElementById('fordata3').innerText = null;
 var opt = document.createElement('option');
opt.value = c;
opt.innerHTML = c;
document.getElementById('fordata3').appendChild(opt);
  }

JSFiddle

Answer 2

试试这个

function settext(x){
    var tabel = document.getElementById('data');
    var cells = tabel.rows[x].getElementsByTagName('td');

    var a = cells[0].innerHTML;
    var b = cells[1].innerHTML;
    var c = cells[2].innerHTML;
    document.getElementsByid('fordata1').value = a;
    document.getElementsByid('fordata2').value = b;
    document.getElementsByid('fordata3').value = c;
}

Answer 3

这是一个简单的方法

<table id="data" border="1" style="margin-top:50px" align="center">
    <caption align="center">Tabel Data Mahasiswa</caption>
    <tr style="text-align:center">
    <strong>
    <th width="150px">NIM</td>
    <th width="250px">Nama</td>
    <th width="250px">Jurusan</td>
    </strong>
    </tr>
    <tr onclick="settext(this)">
    <td>Data1</td>
    <td>Data2</td>
    <td>Data3</td>
    </tr>
    <tr onclick="settext(this)">
    <td>Dataa</td>
    <td>Datab</td>
    <td>Datac</td>
    </tr>
</table>

<input type="number" id="fordata1">
<input type="text" id="fordata2">
<select id="fordata3" style="width:173px">
</select>

<script>
function settext(x){
    var tds = x.children;
    var a = tds[0].innerHTML;
    var b = tds[1].innerHTML;
    var c = tds[2].innerHTML;
    document.getElementById('fordata1').value = a;
    document.getElementById('fordata2').value = b;
    document.getElementById('fordata3').value = c;
  }
</script>

如何从点击的HTML行表中更改输入类型字段的值？

3 个答案: