Поље за потврду је изборно поље које омогућава корисницима да направе бинарни избор (тачно или нетачно) тако што ће га означити и опозвати. У основи, поље за потврду је икона, која се често користи у ГУИ формама и апликацијама за добијање једног или више уноса од корисника.
- Ако је поље за потврду означено или означено, то означава да истина ; то значи да је корисник изабрао вредност.
- Ако поље за потврду није означено или није означено, означава да лажно ; то значи да корисник није изабрао вредност.
Запамтите да поље за потврду се разликује од радио дугмета и падајуће листе јер дозвољава више избора одједном. Насупрот томе, радио дугме и падајући мени омогућавају да изаберемо само једну од датих опција.
шта је монитор
У овом поглављу ћемо сада видети како да добијемо све означене вредности поља за потврду коришћењем ЈаваСцрипт .
Креирајте синтаксу поља за потврду
Да бисте направили поље за потврду користите ХТМЛ картицу и унесите='цхецкбок' унутар картице као што је приказано испод -
Yes
Иако можете да креирате и поље за потврду креирањем објекта за потврду преко ЈаваСцрипт-а, али овај метод је мало компликован. Касније ћемо разговарати о оба приступа -
Примери
Креирајте и добијте вредност поља за потврду
У овом примеру направићемо два поља за потврду, али под условом да ће корисник морати да означи само једно поље за потврду између њих. Затим ћемо преузети вредност означеног поља за потврду. Погледајте код испод:
Копирај код
<h2>Create a checkbox and get its value</h2> <h3> Are you a web developer? </h3> Yes: No: <br> <br> Submit <br> <h4> <h4> function checkCheckbox() { var yes = document.getElementById('myCheck1'); var no = document.getElementById('myCheck2'); if (yes.checked == true && no.checked == true){ return document.getElementById('error').innerHTML = 'Please mark only one checkbox either Yes or No'; } else if (yes.checked == true){ var y = document.getElementById('myCheck1').value; return document.getElementById('result').innerHTML = y; } else if (no.checked == true){ var n = document.getElementById('myCheck2').value; return document.getElementById('result').innerHTML = n; } else { return document.getElementById('error').innerHTML = '*Please mark any of checkbox'; } } </h4></h4> Тестирајте одмах Излаз
латекс величине текста
Ако означите да поље за потврду, а затим кликните на прихвати дугме, приказаће се порука као што је приказано у наставку:
Ако кликнете на прихвати дугме без означавања било којег од поља за потврду, биће приказана порука о грешци.
Слично томе, можете проверити излаз за друге услове.
стринг јава
Добијте све вредности поља за потврду
Сада ћете видети како да добијете све вредности поља за потврду које је означио корисник. Погледајте пример у наставку.
Копирај код
<h2>Create a checkbox and get its value</h2> <h4> Select the programming language, you know </h4> <tr> <td> Java: </td> <td> PHP: </td> </tr> <tr> <td> Angular: </td> <td> CSS: </td> </tr> <tr> <td> Python: </td> <td> Android: </td> Check all <br> <br> Submit <br> <h4></h4> function checkAll() { var inputs = document.querySelectorAll('.pl'); for (var i = 0; i <inputs.length; i++) { inputs[i].checked="true;" } function getcheckboxvalue() var l1="document.getElementById('check1');" l2="document.getElementById('check2');" l3="document.getElementById('check3');" l4="document.getElementById('check4');" l5="document.getElementById('check5');" l6="document.getElementById('check6');" res=" " ; if (l1.checked="=" true){ pl1="document.getElementById('check1').value;" + ','; else (l2.checked="=" pl2="document.getElementById('check2').value;" (l3.checked="=" document.write(res); pl3="document.getElementById('check3').value;" (l4.checked="=" pl4="document.getElementById('check4').value;" (l5.checked="=" pl5="document.getElementById('check5').value;" (l6.checked="=" pl6="document.getElementById('check6').value;" pl6; return document.getelementbyid('result').innerhtml="You have not selected anything" ' languages'; < pre> <span> Test it Now </span> <p> <strong>Output</strong> </p> <p>By executing this code, we will get a response like the below screenshot having some programming languages where you can choose the language you know.</p> <img src="//techcodeview.com/img/javascript-tutorial/63/how-get-all-checked-checkbox-value-javascript-3.webp" alt="How to get all checked checkbox value in JavaScript"> <p>Here, you click on the <strong>Check all</strong> button, it will mark all the programming language checkboxes. After that, click on the <strong>Submit</strong> button to get the response.</p> <img src="//techcodeview.com/img/javascript-tutorial/63/how-get-all-checked-checkbox-value-javascript-4.webp" alt="How to get all checked checkbox value in JavaScript"> <p>Although you can select the language one by one by marking an individual checkbox and then click on the <strong>Submit</strong> button to get the result.</p> <img src="//techcodeview.com/img/javascript-tutorial/63/how-get-all-checked-checkbox-value-javascript-5.webp" alt="How to get all checked checkbox value in JavaScript"> <p> <strong>Output: When you have not selected anything</strong> </p> <img src="//techcodeview.com/img/javascript-tutorial/63/how-get-all-checked-checkbox-value-javascript-6.webp" alt="How to get all checked checkbox value in JavaScript"> <h2>Get all marked checkboxes value using querySelectorAll() method</h2> <p>There is one more method to get all selected values from the checkboxes marked by the user. You will now see how to get the value of all checkboxes using the querySelectorAll() method marked by the user. This will fetch the checkboxes values from the HTML form and display the result.</p> <h3>Get all checkbox value</h3> <p>Now, you will see how to get all checkbox values marked by the user. See the below example.</p> <p> <strong>Copy Code</strong> </p> <pre> <h2> Get all marked checkboxes value </h2> <h4> Select the programming language, you know </h4> <tr> <td> Java: </td> <td> PHP: </td> </tr> <tr> <td> Angular: </td> <td> CSS: </td> </tr> <tr> <td> Python: </td> <td> Android: </td> <br> <br> Submit <br> <h4></h4> document.getElementById('btn').onclick = function() { var markedCheckbox = document.getElementsByName('pl'); for (var checkbox of markedCheckbox) { if (checkbox.checked) document.body.append(checkbox.value + ' '); } } </tr></pre> <span> Test it Now </span> <p> <strong>Output</strong> </p> <p>Here, you can see that all marked checkboxes value has been returned.</p> <img src="//techcodeview.com/img/javascript-tutorial/63/how-get-all-checked-checkbox-value-javascript-7.webp" alt="How to get all checked checkbox value in JavaScript"> <h3>Different JavaScript codes to get marked checkboxes value</h3> <p>JavaScript Code to get all checked checkbox values</p> <pre> document.getElementById('btn').onclick = function() { var markedCheckbox = document.getElementsByName('pl'); for (var checkbox of markedCheckbox) { if (checkbox.checked) document.body.append(checkbox.value + ' '); } } </pre> <p>You can also use the below code to get all checked checkboxes values.</p> <pre> document.getElementById('btn').onclick = function() { var markedCheckbox = document.querySelectorAll('input[type='checkbox']:checked'); for (var checkbox of markedCheckbox) { document.body.append(checkbox.value + ' '); } } </pre> <p>So, checkbox elements allow to multi-select. This means that the users can select one or more options of their choice defined in the HTML form. Even you can select all the checkboxes. In the above example, you have already seen that.</p> <hr></inputs.length;></tr> Тестирајте одмах Излаз
Овде можете видети да је враћена вредност свих означених поља за потврду.
Различити ЈаваСцрипт кодови да бисте добили вредност означених поља за потврду
ЈаваСцрипт код да бисте добили све вредности у пољу за потврду
јава стринг цхарат
document.getElementById('btn').onclick = function() { var markedCheckbox = document.getElementsByName('pl'); for (var checkbox of markedCheckbox) { if (checkbox.checked) document.body.append(checkbox.value + ' '); } } Такође можете користити доњи код да бисте добили све вредности означених поља за потврду.
document.getElementById('btn').onclick = function() { var markedCheckbox = document.querySelectorAll('input[type='checkbox']:checked'); for (var checkbox of markedCheckbox) { document.body.append(checkbox.value + ' '); } } Дакле, елементи поља за потврду омогућавају вишеструки избор. То значи да корисници могу да изаберу једну или више опција по свом избору дефинисаних у ХТМЛ форми. Чак и ви можете да изаберете сва поља за потврду. У горњем примеру, то сте већ видели.