1
我想提出一個測驗的網站,並在{ID}測驗的編輯畫面我可以編輯+添加問題(和答案)JavaScript的「複製」 HTML表單
現在我有一個形式,我想使用JavaScript進行「複製」使其變得動態,當然問題編號應該是2,3,4等,然後點擊「添加問題」
這是我以前的,但我認爲有一個更高效方式來複製表格而不是製作一個完整的表格。
但我是那種離套牢怎麼辦呢..
HTML
{{ Form::open(array('url'=>'quizzes/edit', 'id' => 'quiz')) }}
{{ Form::button('Add Question', array('onclick' => 'addQuestion()', 'id' => 'questionadd', 'value' => 'Add new question')) }}
{{ Form::submit('Edit Quiz', array('id' => 'quizsubmit')) }}
<p id="questiontitle">Question 1</p>
{{ Form::text('', null, array('placeholder' => 'Question 1', 'size' => '40', 'id' => 'questions', 'onfocus' => 'showAnswers(this)')) }} <br>
{{ Form::text('', null, array('placeholder' => 'Good Answer', 'size' => '30', 'id' => 'answers')) }}
{{ Form::text('', null, array('placeholder' => 'False Answer', 'size' => '30', 'id' => 'answers')) }}
{{ Form::text('', null, array('placeholder' => 'False Answer', 'size' => '30', 'id' => 'answers')) }}
{{ Form::close() }}
的JavaScript
var qlimit = 10; // Max questions
var qcount = 1; // There are 4 questions already
function addQuestion()
{
// Get the quiz form element
var quiz = document.getElementById('quiz');
// Good to do error checking, make sure we managed to get something
if (quiz) {
if (qcount < qlimit) {
// Create a new <p> element
var newQ = document.createElement('p');
newQ.innerHTML = 'Question ' + (qcount + 1);
// Create the new text box
var newInput = document.createElement('input');
newInput.type = 'text';
newInput.name = 'questions[]'
var newQ = document.createElement('p');
newQ.innerHTML = 'Question ' + (qcount + 1);
// Error checking
if (newInput && newQ) {
// Add the new elements to the form
quiz.appendChild(newQ);
quiz.appendChild(newInput);
// Increment the count
qcount++;
}
}
// Error message when maximum amount of questions is reached
else {
alert('The maximum amount of questions is ' + qcount);
}
}
}