Я буду создавать 2 метки и 2 текстовых поля. Вводя значения, он должен дать мне соответствующий вывод строки и столбца.
ЕСЛИ я ввожу 2 для строк и 3 для столбцов.. вывод будет 2 строки и 3 столбца..
Я запутался, как использовать javascript здесь .. пожалуйста, помогите
изменил ответ Gal V..., который использует ввод вместо подсказок.. jsFiddle
<style type="text/css">
td{min-width:100px;min-height:20px;border:solid 1px #000;}
</style>
<script type="text/javascript">
function createTable() {
document.getElementById('tb_container').innerHTML = "" ;
var rows = document.getElementById('tb_rows').value;
var cols = document.getElementById('tb_cols').value;
tblHtml = '<table>'
for (i=0; i<rows; i +=1 ) {
tblHtml += '<tr>';
for (j=0; j<cols; j +=1 ) {
tblHtml += '<td> </td>';
}
tblHtml += '</tr>';
}
tblHtml += '</table>';
document.getElementById('tb_container').innerHTML = tblHtml;
}
</script>
настройте приведенный ниже код по-своему...
Rows:<input type="text" id="tb_rows" > <br>
Columns : <input type="text" id="tb_cols" >
<input type="button" value="Create Table" onclick="createTable()" >
<div id="tb_container" ></div>
Ну вот:
<style type="text/css">
td{min-width:100px;min-height:20px;border:solid 1px #000;}
</style>
<script type="text/javascript">
window.onload = function() {
document.getElementById('btnCreate').addEventListener('click', function(){
var rows = parseInt(document.getElementById('txtRows').value),
cols = parseInt(document.getElementById('txtCols').value);
create(rows,cols);
});
}
function create(rows, cols) {
if (rows <= 0 || cols <= 0)
return false;
var html = '<table>';
for (i=0;i<rows;i++) {
html += '<tr>';
for (j=0;j<cols;j++) {
html += '<td> </td>';
}
html += '</tr>';
}
html += '</table>';
document.getElementsByTagName('body')[0].innerHTML = html;
}
</script>
rows: <input type="text" id="txtRows" /><br/>
cols: <input type="text" id="txtCols" /><br/>
<input type="button" value="create table" id="btnCreate" />
надеюсь, это поможет.
