Javascript динамически присоединяется к массиву

Я хочу создать страницу с кнопкой текстовое поле и div.Javascript динамически присоединяется к массиву

Всякий раз, когда я вставляю значение в текстовое поле и нажимаю кнопку, это значение должно быть вставлено в массив, и массив будет отображаться в div.

Я попытался следующий код:

<!DOCTYPE html> 
<html> 
<head> 
<title> new staff </title> 
<script type="text/javascript"> 
var data = new Array(); 

function createTable() 
{ 
    var item = document.getElementById('push').value; 
    data.push(item); 

    var theader = '<table border="1">\n'; 
    var tbody = ''; 

    for(var i=0; i<data.length; i++) 
    { 
     tbody += '<tr>'; 
     tbody += '<td>'; 
     tbody += 'Cell ' + data[i] + ',' + j; 
     tbody += '</td>' 
     tbody += '</tr>\n'; 
    } 
    var tfooter = '</table>'; 
    document.getElementById('wrapper').innerHTML = theader + tbody + tfooter; 
} 
</script> 
</head> 

<body> 
<form name="tablegen"> 
<label>Push: <input type="text" name="push" id="push"/></label><br /> 
<input name="generate" type="button" value="Create Table!" onclick='createTable();'/> 
</form> 

<div id="wrapper"></div> 
</body> 
</html>

, но ничего не происходит.

источник

2014-11-02 John Smith

Вы хотите, чтобы отобразить значение в таблице с новой строки? почему вы хотите сохранить его в массиве? – Asik

Вы проверили консоль Javascript на наличие ошибок? Если бы вы это сделали, вы бы сразу обнаружили свою ошибку. – Barmar

Теперь ваш код отлично работает: http://jsfiddle.net/barmar/ubfvya5t/ – Barmar

tbody += 'Cell ' + data[i] + ',' + j;

Куда вы принимаете j? Он нигде не определен.

Возможно, вы имеете в виду i?

Удалите его, и он будет работать нормально.

tbody += 'Cell ' + data[i] + ',' + i;

источник

2014-11-02 08:16:56

Э-э, он это отредактировал. – Barmar

Извините, я не могу поверить, что это было так просто ..... Да, это был ответ, отредактируйте его, как в первый раз, чтобы кто-нибудь с тем же вопросом –

Мое удовольствие, а затем попробуйте посмотреть на консоль .. Это сэкономит ваше время. –

Попробуйте это: заменить «J» с «я» и добавил Div тег с идентификатором, как «обертка».

<!DOCTYPE html> 
<html> 
<head> 
<title> new staff </title> 
<script type="text/javascript"> 
var data = new Array(); 

function createTable() 
{ 
    var item = document.getElementById('push').value; 
    data.push(item); 

    var theader = '<table border="1">\n'; 
    var tbody = ''; 

    for(var i=0; i<data.length; i++) 
    { 
     tbody += '<tr>'; 
     tbody += '<td>'; 
     tbody += 'Cell ' + data[i] + ',' + i; 
     tbody += '</td>' 
     tbody += '</tr>\n'; 
    } 
    var tfooter = '</table>'; 
    document.getElementById('wrapper').innerHTML = theader + tbody + tfooter; 
} 
</script> 
</head> 

<body> 
<form name="tablegen"> 
<label>Push: <input type="text" name="push" id="push"/></label><br /> 
<input name="generate" type="button" value="Create Table!" onclick='createTable();'/> 
</form> 

<div id="wrapper"></div> 
</body> 
</html>

источник

2014-11-02 08:20:17 gsk

Он, кажется, изменил код в вопросе, больше нет 'j'. – Barmar

А, я вижу это. Также его тег div отсутствует в теле. Мысль это то, что он искал. – gsk

И теперь в вопросе тоже есть тег div :-) – gsk

Вот рабочая fiddle

Я бы рекомендовал избавиться от противного метода OnClick, плохая практика. Прикрепите прослушиватель событий.

Вот JS.

var data = new Array(); 

function createTable() 
{ 
    var item = document.getElementById('push').value; 
    data.push(item); 

    var theader = '<table border="1">\n'; 
    var tbody = ''; 

    for(var i=0; i<data.length; i++) 
    { 
     tbody += '<tr>'; 
     tbody += '<td>'; 
     tbody += data[i]; 
     tbody += '</td>' 
     tbody += '</tr>\n'; 
    } 
    var tfooter = '</table>'; 
    document.getElementById('wrapper').innerHTML = theader + tbody + tfooter; 
} 

var button = document.querySelector('input[name="generate"]'); 

button.addEventListener('click', createTable);

и HTML

<form name="tablegen"> 
    <label>Push: <input type="text" name="push" id="push"/></label><br /> 
    <input name="generate" type="button" value="Create Table!"/> 
</form> 

<div id="wrapper"></div>

источник

2014-11-02 08:26:05

Javascript динамически присоединяется к массиву

ответ

Смежные вопросы