Bagaimana untuk memasukkan dalam javascript

WBOY
Lepaskan: 2023-05-20 18:58:35
asal
2542 orang telah melayarinya

JavaScript ialah bahasa pengaturcaraan yang biasa digunakan yang digunakan secara meluas dalam banyak bidang seperti pembangunan web, aplikasi mudah alih dan pelayan. Sebagai seorang pemula, jika anda ingin mempelajari JavaScript dengan baik, selain memahami sintaks asas dan API biasa bahasa, anda juga perlu menguasai beberapa kaedah input Artikel ini akan memperkenalkan secara terperinci beberapa kaedah input dalam JavaScript.

  1. Kotak gesaan

Salah satu kaedah input paling asas yang digunakan dalam JavaScript ialah kotak gesaan, yang boleh muncul kotak dialog untuk menggesa pengguna memasukkan teks. Terdapat tiga jenis kotak gesaan: makluman, sahkan dan gesaan.

(1) makluman

makluman ialah kotak dialog yang hanya memaparkan maklumat segera Ia sering digunakan untuk memaparkan maklumat kepada pengguna atau mengingatkan pengguna tentang perkara tertentu. Kotak dialog amaran hanya mempunyai satu butang OK dan tidak boleh mendapatkan input pengguna.

Format tatabahasa:

alert(message);
Salin selepas log masuk

Contoh:

alert("Hello World!");
Salin selepas log masuk

(2) confirm

confirm ialah kotak dialog yang memerlukan pengesahan pengguna, selalunya digunakan untuk bertanya kepada pengguna Sama ada hendak melakukan operasi. Kotak dialog pengesahan mempunyai dua butang: OK dan Batal, pengguna boleh memilih mengikut situasi.

Format tatabahasa:

confirm(message);
Salin selepas log masuk

Contoh:

var result = confirm("确定要删除该记录吗?");
if (result == true) {
    deleteRecord();
} else {
    // do nothing
}
Salin selepas log masuk

(3) prompt

prompt ialah kotak dialog yang memerlukan pengguna memasukkan teks, sering digunakan untuk mendapatkan Pengguna memasukkan data. Kotak dialog gesaan mempunyai dua butang: OK dan Batal, pengguna boleh memilih mengikut situasi. Teks yang dimasukkan oleh pengguna akan dikembalikan sebagai rentetan.

Format tatabahasa:

prompt(message, default);
Salin selepas log masuk

Contoh:

var name = prompt("请输入你的名字:", "张三");
alert("你好," + name + "!");
Salin selepas log masuk
  1. Kotak input

Selain menggunakan kotak gesaan, JavaScript juga boleh gunakan kotak input untuk masuk. Kotak input biasanya diletakkan dalam halaman HTML dan menggunakan skrip JavaScript untuk mendapatkan dan memproses data yang dimasukkan pengguna.

(1) Kotak teks

Kotak teks ialah kotak input biasa yang membolehkan pengguna memasukkan teks dan mendapatkan nilai dalam kotak teks melalui skrip JavaScript. Hanya gunakan kotak teks untuk menambah elemen input pada halaman HTML anda.

Contoh HTML:

<input type="text" id="myInput">
Salin selepas log masuk

Contoh JavaScript:

var input = document.getElementById("myInput");
var value = input.value;
alert("你输入的是:" + value);
Salin selepas log masuk

(2) Kotak lungsur turun

Kotak lungsur turun ialah jenis yang hanya membenarkan pengguna untuk memilih daripada pilihan yang ditentukan Kotak input, skrip JavaScript boleh digunakan untuk mendapatkan pilihan yang dipilih oleh pengguna dalam kotak lungsur.

Contoh HTML:

<select id="mySelect">
  <option>苹果</option>
  <option>香蕉</option>
  <option>橙子</option>
</select>
Salin selepas log masuk

Contoh JavaScript:

var select = document.getElementById("mySelect");
var optionIndex = select.selectedIndex;
var option = select.options[optionIndex];
var value = option.value;
alert("你选择的是:" + value);
Salin selepas log masuk

(3) Butang radio dan kotak semak

Butang radio dan kotak semak masing-masing Digunakan untuk membenarkan pengguna untuk memilih satu atau lebih pilihan daripada berbilang pilihan. Menggunakan butang radio dan kotak semak adalah serupa dengan menggunakan kotak lungsur, menggunakan skrip JavaScript untuk mendapatkan pilihan yang dipilih oleh pengguna.

Contoh HTML:

<input type='radio' name='gender' value='male'>男
<input type='radio' name='gender' value='female'>女

<input type='checkbox' name='fruits' value='apple'>苹果
<input type='checkbox' name='fruits' value='banana'>香蕉
<input type='checkbox' name='fruits' value='orange'>橙子
Salin selepas log masuk

Contoh JavaScript:

var gender = document.getElementsByName("gender");
for (var i = 0; i < gender.length; i++) {
    if (gender[i].checked) {
        var value = gender[i].value;
        alert("你选择的性别是:" + value);
    }
}

var fruits = document.getElementsByName("fruits");
for (var i = 0; i < fruits.length; i++) {
    if (fruits[i].checked) {
        var value = fruits[i].value;
        alert("你选择的水果是:" + value);
    }
}
Salin selepas log masuk
  1. Muat naik fail

Dalam sesetengah senario, kami memerlukan pengguna untuk memuat naik Fail , seperti memuat naik avatar, memuat naik fail, dsb. Dalam JavaScript, kami boleh mencipta kotak muat naik fail melalui elemen input, dan kemudian menggunakan skrip JavaScript untuk mendapatkan fail yang dipilih oleh pengguna.

Contoh HTML:

<input type='file' id='myFile'>
Salin selepas log masuk

Contoh JavaScript:

var fileInput = document.getElementById('myFile');
var file = fileInput.files[0];
var fileName = file.name;
alert("你选择的文件是:" + fileName);
Salin selepas log masuk

Ringkasan

Di atas adalah beberapa kaedah memasukkan dalam JavaScript, termasuk kotak gesaan dan kotak input dan muat naik fail. Selepas menguasai kaedah input ini, kita boleh berinteraksi dengan pengguna dengan mudah dan mendapatkan data yang dimasukkan pengguna. Sudah tentu, ini hanyalah asas input JavaScript Jika anda ingin mengetahui lebih lanjut tentang input JavaScript, anda perlu mengetahui lebih lanjut tentang bahasa JavaScript itu sendiri. Saya harap artikel ini dapat membantu semua orang!

Atas ialah kandungan terperinci Bagaimana untuk memasukkan dalam javascript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!