帶有JavaScript的HTML，提交按鈕

Question

我正在嘗試編寫一個簡單的小部件來衡量Net Promoter得分。 這是我到目前為止的內容：

<!DOCTYPE html>
<html>
<body>
<link type="text/css" rel="stylesheet" href="NPSstyle.css"/>
    <h1>Net Promoter Score<h1>
        <p class="question">How likely are you to recommend this tool to a friend or colleague?</p>
<form id="myForm">

    <button type="button" id="button1">1</button>
    <button type="button" id="button2">2</button>
    <button type="button" id="button3">3</button>
    <button type="button" id="button4">4</button>
    <button type="button" id="button5">5</button>
    <button type="button" id="button6">6</button>
    <button type="button" id="button7">7</button>
    <button type="button" id="button8">8</button>
    <button type="button" id="button9">9</button>
    <button type="button" id="button10">10</button>
    <button type="submit" class="input submit">Submit</button>
</form>
<p class="explanation">Not likely............................................................Very likely</p>


<script>

var userRating

document.getElementById('button1').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 1;
}
document.getElementById('button2').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 2;
}
document.getElementById('button3').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 3;
}
document.getElementById('button4').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 4;
}
document.getElementById('button5').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 5;
}
document.getElementById('button6').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 6;
}
document.getElementById('button7').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 7;
}
document.getElementById('button8').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 8;
}
document.getElementById('button9').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 9;
}
document.getElementById('button10').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 10;
}


</script>

我目前正在嘗試弄清楚如何使Submit正常工作。 我希望用戶按下代表其分數的按鈕，然后按提交以注冊其分數。 現在，我只希望他們的分數在他們單擊“提交”時顯示在控制台中，但是最終它將被保存到服務器中，而這只是一個小部件，將在瀏覽器的屏幕上彈出。 我開始在真空中制作東西以幫助自己學習。 我希望有人指出我正確的方向或給我提示。 這是我對JavaScript的初次體驗，因此我仍在學習。 謝謝！

Answer 1

與將onclick處理程序添加到按鈕的方式相同，可以將onsubmit處理程序添加到表單。

document.getElementById('myForm').onsubmit = function() {
    console.log(userRating);
}

帶有JavaScript的HTML，提交按鈕

問題描述

1 個解決方案

解決方案1
1 2016-03-09 18:56:49

帶有JavaScript的HTML，提交按鈕

問題描述

1 個解決方案

解決方案1 1 2016-03-09 18:56:49

解決方案1
1 2016-03-09 18:56:49