jQuery ਵਿੱਚ ਚੈੱਕਬਾਕਸ ਰਾਜਾਂ ਨੂੰ ਸਮਝਣਾ
ਵੈੱਬ ਵਿਕਾਸ ਵਿੱਚ, ਚੈੱਕਬਾਕਸ ਵਰਗੇ ਫਾਰਮ ਤੱਤਾਂ ਨੂੰ ਸੰਭਾਲਣਾ ਇੱਕ ਆਮ ਕੰਮ ਹੈ। ਇਹ ਜਾਂਚ ਕਰਨਾ ਕਿ ਕੀ ਇੱਕ ਚੈਕਬਾਕਸ ਚੁਣਿਆ ਗਿਆ ਹੈ, ਪੰਨੇ 'ਤੇ ਹੋਰ ਤੱਤਾਂ ਦੇ ਪ੍ਰਦਰਸ਼ਨ ਨੂੰ ਨਿਯੰਤਰਿਤ ਕਰ ਸਕਦਾ ਹੈ। ਇਹ ਵਿਸ਼ੇਸ਼ ਤੌਰ 'ਤੇ ਉਹਨਾਂ ਫਾਰਮਾਂ ਵਿੱਚ ਲਾਭਦਾਇਕ ਹੈ ਜਿੱਥੇ ਉਪਭੋਗਤਾ ਦੇ ਇਨਪੁਟ ਦੇ ਆਧਾਰ 'ਤੇ ਖਾਸ ਖੇਤਰਾਂ ਨੂੰ ਦਿਖਾਉਣ ਜਾਂ ਲੁਕਾਉਣ ਦੀ ਲੋੜ ਹੁੰਦੀ ਹੈ।
ਇਸ ਲੇਖ ਵਿੱਚ, ਅਸੀਂ ਖੋਜ ਕਰਾਂਗੇ ਕਿ jQuery ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਇੱਕ ਚੈਕਬਾਕਸ ਦੀ ਜਾਂਚ ਕੀਤੀ ਵਿਸ਼ੇਸ਼ਤਾ ਨੂੰ ਕਿਵੇਂ ਚੈੱਕ ਕਰਨਾ ਹੈ। ਅਸੀਂ ਚੈੱਕਬਾਕਸ ਸਥਿਤੀ ਦੀ ਪੁੱਛਗਿੱਛ ਕਰਨ ਵੇਲੇ ਡਿਵੈਲਪਰਾਂ ਦਾ ਸਾਹਮਣਾ ਕਰਨ ਵਾਲੀਆਂ ਆਮ ਸਮੱਸਿਆਵਾਂ ਦਾ ਨਿਪਟਾਰਾ ਵੀ ਕਰਾਂਗੇ ਅਤੇ ਇਹ ਯਕੀਨੀ ਬਣਾਉਣ ਲਈ ਇੱਕ ਕਾਰਜਸ਼ੀਲ ਹੱਲ ਪ੍ਰਦਾਨ ਕਰਾਂਗੇ ਕਿ ਤੁਹਾਡਾ ਕੋਡ ਉਮੀਦ ਅਨੁਸਾਰ ਵਿਵਹਾਰ ਕਰਦਾ ਹੈ।
ਹੁਕਮ | ਵਰਣਨ |
---|---|
$(document).ready() | ਇੱਕ jQuery ਫੰਕਸ਼ਨ ਜੋ HTML ਦਸਤਾਵੇਜ਼ ਦੇ ਪੂਰੀ ਤਰ੍ਹਾਂ ਲੋਡ ਹੋਣ 'ਤੇ ਨਿਰਧਾਰਤ ਕੋਡ ਨੂੰ ਚਲਾਉਂਦਾ ਹੈ। |
$('#isAgeSelected').change() | ਇੱਕ jQuery ਇਵੈਂਟ ਹੈਂਡਲਰ ਜੋ ਚੈਕਬਾਕਸ ਦੀ ਸਥਿਤੀ ਬਦਲਣ 'ਤੇ ਕਾਰਵਾਈ ਸ਼ੁਰੂ ਕਰਦਾ ਹੈ। |
$(this).is(':checked') | ਇਹ ਜਾਂਚ ਕਰਨ ਲਈ ਇੱਕ jQuery ਵਿਧੀ ਹੈ ਕਿ ਕੀ ਮੌਜੂਦਾ ਚੈਕਬਾਕਸ ਚੁਣਿਆ ਗਿਆ ਹੈ। |
document.addEventListener('DOMContentLoaded') | ਇੱਕ ਵਨੀਲਾ JavaScript ਇਵੈਂਟ ਜੋ HTML ਦਸਤਾਵੇਜ਼ ਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਲੋਡ ਅਤੇ ਪਾਰਸ ਕੀਤੇ ਜਾਣ ਤੋਂ ਬਾਅਦ ਨਿਰਧਾਰਤ ਕੋਡ ਨੂੰ ਚਲਾਉਂਦਾ ਹੈ। |
checkbox.checked | ਇੱਕ ਵਨੀਲਾ JavaScript ਵਿਸ਼ੇਸ਼ਤਾ ਜੋ ਸਹੀ ਵਾਪਸ ਆਉਂਦੀ ਹੈ ਜੇਕਰ ਚੈਕਬਾਕਸ 'ਤੇ ਨਿਸ਼ਾਨ ਲਗਾਇਆ ਜਾਂਦਾ ਹੈ, ਨਹੀਂ ਤਾਂ ਗਲਤ। |
useState() | ਇੱਕ ਪ੍ਰਤੀਕਿਰਿਆ ਹੁੱਕ ਜੋ ਤੁਹਾਨੂੰ ਕਾਰਜਸ਼ੀਲ ਹਿੱਸਿਆਂ ਵਿੱਚ ਸਟੇਟ ਜੋੜਨ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ। |
onChange() | ਇੱਕ ਰੀਐਕਟ ਇਵੈਂਟ ਹੈਂਡਲਰ ਜੋ ਚੈਕਬਾਕਸ ਸਥਿਤੀ ਬਦਲਣ 'ਤੇ ਕਾਰਵਾਈ ਸ਼ੁਰੂ ਕਰਦਾ ਹੈ। |
ਚੈੱਕਬਾਕਸ ਸਥਿਤੀ ਨੂੰ ਕੁਸ਼ਲਤਾ ਨਾਲ ਸੰਭਾਲਣਾ
ਪਹਿਲੀ ਸਕਰਿਪਟ ਵਰਤਦਾ ਹੈ jQuery ਚੈੱਕਬਾਕਸ ਸਥਿਤੀ ਨੂੰ ਸੰਭਾਲਣ ਲਈ. ਨਾਲ ਸ਼ੁਰੂ ਹੁੰਦਾ ਹੈ $(document).ready() ਇਹ ਯਕੀਨੀ ਬਣਾਉਣ ਲਈ ਕਿ ਸਕ੍ਰਿਪਟ ਚਲਾਉਣ ਤੋਂ ਪਹਿਲਾਂ DOM ਪੂਰੀ ਤਰ੍ਹਾਂ ਲੋਡ ਹੋ ਗਿਆ ਹੈ। ਦ $('#isAgeSelected').change() ਫੰਕਸ਼ਨ ਇੱਕ ਇਵੈਂਟ ਹੈਂਡਲਰ ਨੂੰ ਜੋੜਦਾ ਹੈ ਜੋ ਜਦੋਂ ਵੀ ਚੈਕਬਾਕਸ ਸਥਿਤੀ ਬਦਲਦਾ ਹੈ ਤਾਂ ਚਾਲੂ ਹੁੰਦਾ ਹੈ। ਇਸ ਫੰਕਸ਼ਨ ਦੇ ਅੰਦਰ, $(this).is(':checked') ਚੈੱਕਬਾਕਸ ਨੂੰ ਚੈੱਕ ਕਰਨ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ। ਜੇਕਰ ਇਹ ਹੈ, ਤਾਂ ਟੈਕਸਟਬਾਕਸ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਦਿਖਾਇਆ ਗਿਆ ਹੈ $('#txtAge').show(); ਨਹੀਂ ਤਾਂ, ਇਸ ਨਾਲ ਲੁਕਿਆ ਹੋਇਆ ਹੈ $('#txtAge').hide(). ਇਹ ਵਿਧੀ jQuery ਵਿੱਚ ਚੈੱਕਬਾਕਸ ਸਥਿਤੀਆਂ ਨੂੰ ਸੰਭਾਲਣ ਲਈ ਕੁਸ਼ਲ ਹੈ, ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦਾ ਹੈ ਕਿ ਪੰਨਾ ਉਪਭੋਗਤਾ ਦੀਆਂ ਕਾਰਵਾਈਆਂ ਲਈ ਗਤੀਸ਼ੀਲ ਤੌਰ 'ਤੇ ਜਵਾਬ ਦਿੰਦਾ ਹੈ।
ਦੂਜੀ ਸਕ੍ਰਿਪਟ ਵਨੀਲਾ ਜਾਵਾ ਸਕ੍ਰਿਪਟ ਵਿੱਚ ਲਿਖੀ ਗਈ ਹੈ। ਨਾਲ ਸ਼ੁਰੂ ਹੁੰਦਾ ਹੈ document.addEventListener('DOMContentLoaded') ਇਹ ਯਕੀਨੀ ਬਣਾਉਣ ਲਈ ਕਿ ਸਕ੍ਰਿਪਟ HTML ਦਸਤਾਵੇਜ਼ ਦੇ ਪੂਰੀ ਤਰ੍ਹਾਂ ਲੋਡ ਹੋਣ ਤੋਂ ਬਾਅਦ ਚੱਲਦੀ ਹੈ। ਸਕ੍ਰਿਪਟ ਚੈਕਬਾਕਸ ਅਤੇ ਟੈਕਸਟਬਾਕਸ ਐਲੀਮੈਂਟਸ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਮੁੜ ਪ੍ਰਾਪਤ ਕਰਦੀ ਹੈ document.getElementById(). ਇਹ ਫਿਰ ਚੈਕਬਾਕਸ ਵਿੱਚ ਇੱਕ ਇਵੈਂਟ ਲਿਸਨਰ ਜੋੜਦਾ ਹੈ ਜੋ ਤਬਦੀਲੀਆਂ ਲਈ ਸੁਣਦਾ ਹੈ। ਦ checkbox.checked ਸੰਪੱਤੀ ਦੀ ਵਰਤੋਂ ਚੈਕਬਾਕਸ ਦੀ ਸਥਿਤੀ ਦੀ ਜਾਂਚ ਕਰਨ ਲਈ ਕੀਤੀ ਜਾਂਦੀ ਹੈ। ਜੇਕਰ ਚੈਕਬਾਕਸ 'ਤੇ ਨਿਸ਼ਾਨ ਲਗਾਇਆ ਜਾਂਦਾ ਹੈ, ਤਾਂ ਟੈਕਸਟ ਬਾਕਸ ਸੈਟਿੰਗ ਦੁਆਰਾ ਪ੍ਰਦਰਸ਼ਿਤ ਹੁੰਦਾ ਹੈ textBox.style.display 'ਬਲਾਕ' ਕਰਨ ਲਈ; ਜੇਕਰ ਨਹੀਂ, ਤਾਂ ਇਹ ਡਿਸਪਲੇ ਨੂੰ 'ਕੋਈ ਨਹੀਂ' 'ਤੇ ਸੈੱਟ ਕਰਕੇ ਲੁਕਾਇਆ ਜਾਂਦਾ ਹੈ। ਇਹ ਪਹੁੰਚ ਦਰਸਾਉਂਦੀ ਹੈ ਕਿ ਬਾਹਰੀ ਲਾਇਬ੍ਰੇਰੀਆਂ 'ਤੇ ਨਿਰਭਰ ਕੀਤੇ ਬਿਨਾਂ ਚੈੱਕਬਾਕਸ ਸਥਿਤੀਆਂ ਦਾ ਪ੍ਰਬੰਧਨ ਕਿਵੇਂ ਕਰਨਾ ਹੈ।
jQuery ਨਾਲ ਚੈੱਕਬਾਕਸ ਸਥਿਤੀ ਦੀ ਜਾਂਚ ਕੀਤੀ ਜਾ ਰਹੀ ਹੈ
ਚੈੱਕਬਾਕਸ ਸਥਿਤੀ ਨੂੰ ਸੰਭਾਲਣ ਲਈ jQuery ਦੀ ਵਰਤੋਂ ਕਰਨਾ
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="isAgeSelected"/>
<div id="txtAge" style="display:none">Age is selected</div>
<script>
$(document).ready(function() {
$('#isAgeSelected').change(function() {
if ($(this).is(':checked')) {
$('#txtAge').show();
} else {
$('#txtAge').hide();
}
});
});
</script>
ਵਨੀਲਾ ਜਾਵਾ ਸਕ੍ਰਿਪਟ ਨਾਲ ਚੈੱਕਬਾਕਸ ਸਥਿਤੀ ਦੀ ਪੁਸ਼ਟੀ ਕੀਤੀ ਜਾ ਰਹੀ ਹੈ
ਚੈਕਬਾਕਸ ਹੈਂਡਲਿੰਗ ਲਈ ਵਨੀਲਾ ਜਾਵਾ ਸਕ੍ਰਿਪਟ ਦੀ ਵਰਤੋਂ ਕਰਨਾ
<input type="checkbox" id="isAgeSelected"/>
<div id="txtAge" style="display:none">Age is selected</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
var checkbox = document.getElementById('isAgeSelected');
var textBox = document.getElementById('txtAge');
checkbox.addEventListener('change', function() {
if (checkbox.checked) {
textBox.style.display = 'block';
} else {
textBox.style.display = 'none';
}
});
});
</script>
ਪ੍ਰਤੀਕਿਰਿਆ ਵਿੱਚ ਚੈੱਕਬਾਕਸ ਸਟੇਟ ਹੈਂਡਲਿੰਗ
ਚੈੱਕਬਾਕਸ ਸਥਿਤੀ ਨੂੰ ਕੰਟਰੋਲ ਕਰਨ ਲਈ ਪ੍ਰਤੀਕਿਰਿਆ ਦੀ ਵਰਤੋਂ ਕਰਨਾ
import React, { useState } from 'react';
function App() {
const [isChecked, setIsChecked] = useState(false);
const handleCheckboxChange = () => {
setIsChecked(!isChecked);
};
return (
<div>
<input type="checkbox" id="isAgeSelected" onChange={handleCheckboxChange} />
<div id="txtAge" style={{ display: isChecked ? 'block' : 'none' }}>
Age is selected
</div>
</div>
);
}
export default App;
jQuery ਵਿੱਚ ਐਡਵਾਂਸਡ ਚੈੱਕਬਾਕਸ ਹੈਂਡਲਿੰਗ
jQuery ਵਿੱਚ ਚੈੱਕਬਾਕਸ ਨੂੰ ਸੰਭਾਲਣ ਦਾ ਇੱਕ ਹੋਰ ਮਹੱਤਵਪੂਰਨ ਪਹਿਲੂ ਪੇਜ ਲੋਡ 'ਤੇ ਉਹਨਾਂ ਦੀ ਸ਼ੁਰੂਆਤੀ ਸਥਿਤੀ ਦਾ ਪ੍ਰਬੰਧਨ ਕਰ ਰਿਹਾ ਹੈ। ਜੇਕਰ HTML ਵਿੱਚ ਇੱਕ ਚੈਕਬਾਕਸ ਪਹਿਲਾਂ ਤੋਂ ਚੈੱਕ ਕੀਤਾ ਗਿਆ ਹੈ, ਤਾਂ ਸਕ੍ਰਿਪਟ ਇਸ ਸਥਿਤੀ ਨੂੰ ਸਹੀ ਢੰਗ ਨਾਲ ਸੰਭਾਲਣ ਦੇ ਯੋਗ ਹੋਣੀ ਚਾਹੀਦੀ ਹੈ। ਤੁਸੀਂ ਵਰਤ ਸਕਦੇ ਹੋ $(document).ready() ਚੈੱਕਬਾਕਸ ਦੀ ਸ਼ੁਰੂਆਤੀ ਸਥਿਤੀ ਦੀ ਜਾਂਚ ਕਰਨ ਲਈ ਅਤੇ ਉਸ ਅਨੁਸਾਰ ਸੰਬੰਧਿਤ ਤੱਤਾਂ ਦੀ ਦਿੱਖ ਨੂੰ ਸੈੱਟ ਕਰੋ। ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦਾ ਹੈ ਕਿ UI ਸ਼ੁਰੂ ਤੋਂ ਹੀ ਫਾਰਮ ਤੱਤਾਂ ਦੀ ਸਹੀ ਸਥਿਤੀ ਨੂੰ ਦਰਸਾਉਂਦਾ ਹੈ, ਉਪਭੋਗਤਾ ਅਨੁਭਵ ਨੂੰ ਬਿਹਤਰ ਬਣਾਉਂਦਾ ਹੈ।
ਇਸ ਤੋਂ ਇਲਾਵਾ, ਇੱਕ ਫਾਰਮ ਵਿੱਚ ਇੱਕ ਤੋਂ ਵੱਧ ਚੈਕਬਾਕਸਾਂ ਨੂੰ ਸੰਭਾਲਣਾ jQuery ਨਾਲ ਚੋਣਕਾਰਾਂ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਸੁਚਾਰੂ ਬਣਾਇਆ ਜਾ ਸਕਦਾ ਹੈ ਜੋ ਚੈਕਬਾਕਸਾਂ ਦੇ ਸਮੂਹਾਂ ਨੂੰ ਨਿਸ਼ਾਨਾ ਬਣਾਉਂਦੇ ਹਨ। ਉਦਾਹਰਨ ਲਈ, ਵਰਤ ਕੇ $('input[type="checkbox"]').each(), ਤੁਸੀਂ ਸਾਰੇ ਚੈਕਬਾਕਸ ਦੁਆਰਾ ਦੁਹਰਾ ਸਕਦੇ ਹੋ ਅਤੇ ਉਹਨਾਂ ਦੀਆਂ ਵਿਅਕਤੀਗਤ ਸਥਿਤੀਆਂ ਦੇ ਅਧਾਰ ਤੇ ਲੋੜੀਂਦੇ ਤਰਕ ਨੂੰ ਲਾਗੂ ਕਰ ਸਕਦੇ ਹੋ। ਇਹ ਪਹੁੰਚ ਵਿਸ਼ੇਸ਼ ਤੌਰ 'ਤੇ ਬਹੁਤ ਸਾਰੇ ਕੰਡੀਸ਼ਨਲ ਫੀਲਡਾਂ ਵਾਲੇ ਗੁੰਝਲਦਾਰ ਰੂਪਾਂ ਵਿੱਚ ਉਪਯੋਗੀ ਹੈ, ਜਿਸ ਨਾਲ ਕੋਡ ਨੂੰ ਵਧੇਰੇ ਕੁਸ਼ਲ ਅਤੇ ਬਣਾਈ ਰੱਖਣਾ ਆਸਾਨ ਹੋ ਜਾਂਦਾ ਹੈ।
jQuery ਨਾਲ ਚੈੱਕਬਾਕਸ ਨੂੰ ਸੰਭਾਲਣ ਬਾਰੇ ਆਮ ਸਵਾਲ
- ਮੈਂ ਕਿਵੇਂ ਜਾਂਚ ਕਰਾਂਗਾ ਕਿ ਕੀ jQuery ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਇੱਕ ਚੈਕਬਾਕਸ ਦੀ ਜਾਂਚ ਕੀਤੀ ਗਈ ਹੈ?
- ਤੁਸੀਂ ਵਰਤ ਸਕਦੇ ਹੋ $('#checkboxId').is(':checked') ਇਹ ਵੇਖਣ ਲਈ ਕਿ ਕੀ ਇੱਕ ਚੈਕਬਾਕਸ ਚੁਣਿਆ ਗਿਆ ਹੈ।
- ਜਦੋਂ ਇੱਕ ਚੈਕਬਾਕਸ ਸਥਿਤੀ ਬਦਲਦੀ ਹੈ ਤਾਂ ਮੈਂ ਇੱਕ ਇਵੈਂਟ ਨੂੰ ਕਿਵੇਂ ਚਾਲੂ ਕਰਾਂ?
- ਦੀ ਵਰਤੋਂ ਕਰੋ .change() jQuery ਵਿੱਚ ਇਵੈਂਟ ਹੈਂਡਲਰ: $('#checkboxId').change(function() { ... }).
- ਮੈਂ jQuery ਵਿੱਚ ਚੈੱਕ ਕੀਤੇ ਚੈੱਕਬਾਕਸ ਦਾ ਮੁੱਲ ਕਿਵੇਂ ਪ੍ਰਾਪਤ ਕਰਾਂ?
- ਵਰਤੋ $('#checkboxId').val() ਚੈੱਕ ਕੀਤੇ ਚੈੱਕਬਾਕਸ ਦਾ ਮੁੱਲ ਪ੍ਰਾਪਤ ਕਰਨ ਲਈ।
- ਕੀ ਮੈਂ ਇੱਕ ਸਿੰਗਲ ਇਵੈਂਟ ਹੈਂਡਲਰ ਨਾਲ ਕਈ ਚੈੱਕਬਾਕਸਾਂ ਨੂੰ ਸੰਭਾਲ ਸਕਦਾ/ਸਕਦੀ ਹਾਂ?
- ਹਾਂ, ਤੁਸੀਂ ਵਰਤ ਸਕਦੇ ਹੋ $('input[type="checkbox"]').change(function() { ... }) ਕਈ ਚੈੱਕਬਾਕਸਾਂ ਨੂੰ ਸੰਭਾਲਣ ਲਈ।
- ਮੈਂ jQuery ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਚੈੱਕਬਾਕਸ ਨੂੰ ਚੈੱਕ ਜਾਂ ਅਣਚੈਕ ਕਰਨ ਲਈ ਕਿਵੇਂ ਸੈੱਟ ਕਰਾਂ?
- ਵਰਤੋ $('#checkboxId').prop('checked', true) ਇੱਕ ਚੈਕਬਾਕਸ ਨੂੰ ਚੈੱਕ ਕਰਨ ਲਈ, ਅਤੇ $('#checkboxId').prop('checked', false) ਇਸ ਨੂੰ ਅਨਚੈਕ ਕਰਨ ਲਈ.
- ਮੈਂ ਪੰਨਾ ਲੋਡ ਹੋਣ 'ਤੇ ਚੈੱਕਬਾਕਸ ਦੀ ਸ਼ੁਰੂਆਤੀ ਸਥਿਤੀ ਦੀ ਜਾਂਚ ਕਿਵੇਂ ਕਰ ਸਕਦਾ ਹਾਂ?
- ਅੰਦਰ ਰਾਜ ਦੀ ਜਾਂਚ ਕਰੋ $(document).ready() ਅਤੇ ਉਸ ਅਨੁਸਾਰ ਸੰਬੰਧਿਤ ਤੱਤਾਂ ਦੀ ਦਿੱਖ ਸੈਟ ਕਰੋ।
- ਵਿਚਕਾਰ ਕੀ ਫਰਕ ਹੈ .attr() ਅਤੇ .prop() jQuery ਵਿੱਚ?
- .attr() ਇੱਕ ਸਤਰ ਦੇ ਤੌਰ ਤੇ ਗੁਣ ਮੁੱਲ ਪ੍ਰਾਪਤ ਕਰਦਾ ਹੈ, ਜਦਕਿ .prop() 'ਚੈੱਕਡ' ਵਰਗੀਆਂ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਲਈ ਬੁਲੀਅਨ ਵਜੋਂ ਸੰਪੱਤੀ ਮੁੱਲ ਪ੍ਰਾਪਤ ਕਰਦਾ ਹੈ।
- ਮੈਂ jQuery ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਇੱਕ ਚੈੱਕਬਾਕਸ ਨੂੰ ਕਿਵੇਂ ਅਸਮਰੱਥ ਕਰਾਂ?
- ਵਰਤੋ $('#checkboxId').prop('disabled', true) ਇੱਕ ਚੈੱਕਬਾਕਸ ਨੂੰ ਅਯੋਗ ਕਰਨ ਲਈ.
ਕੁਸ਼ਲ ਚੈੱਕਬਾਕਸ ਸਟੇਟ ਪ੍ਰਬੰਧਨ
ਵੈੱਬ ਵਿਕਾਸ ਵਿੱਚ ਚੈੱਕਬਾਕਸ ਰਾਜਾਂ ਦੇ ਪ੍ਰਬੰਧਨ ਦਾ ਇੱਕ ਮਹੱਤਵਪੂਰਨ ਪਹਿਲੂ ਚੈੱਕਬਾਕਸ ਸਥਿਤੀ ਦੇ ਅਧਾਰ ਤੇ ਸੰਬੰਧਿਤ ਤੱਤਾਂ ਦੇ ਸਹੀ ਪ੍ਰਦਰਸ਼ਨ ਨੂੰ ਯਕੀਨੀ ਬਣਾਉਣਾ ਹੈ। jQuery ਦੀ ਵਰਤੋਂ ਕਰਨਾ .is(':checked') ਵਿਧੀ ਡਿਵੈਲਪਰਾਂ ਨੂੰ ਇਹ ਜਾਂਚ ਕਰਨ ਦੀ ਇਜਾਜ਼ਤ ਦਿੰਦੀ ਹੈ ਕਿ ਕੀ ਇੱਕ ਚੈਕਬਾਕਸ ਚੁਣਿਆ ਗਿਆ ਹੈ ਅਤੇ ਬਾਅਦ ਵਿੱਚ ਉਸ ਅਨੁਸਾਰ ਤੱਤਾਂ ਨੂੰ ਦਿਖਾਓ ਜਾਂ ਲੁਕਾਓ। ਇਹ ਵਿਧੀ ਵਿਸ਼ੇਸ਼ ਤੌਰ 'ਤੇ ਪ੍ਰਭਾਵਸ਼ਾਲੀ ਹੁੰਦੀ ਹੈ ਜਦੋਂ ਕੰਡੀਸ਼ਨਲ ਫੀਲਡਾਂ ਦੇ ਨਾਲ ਸਧਾਰਨ ਫਾਰਮਾਂ ਨੂੰ ਸੰਭਾਲਦੇ ਹਨ।
ਇਸ ਤੋਂ ਇਲਾਵਾ, ਵਧੇਰੇ ਗੁੰਝਲਦਾਰ ਐਪਲੀਕੇਸ਼ਨਾਂ ਵਿੱਚ, ਕਈ ਚੈਕਬਾਕਸਾਂ ਦਾ ਪ੍ਰਬੰਧਨ ਕਰਨਾ ਜ਼ਰੂਰੀ ਹੋ ਜਾਂਦਾ ਹੈ। jQuery ਚੋਣਕਾਰਾਂ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਜਿਵੇਂ ਕਿ $('input[type="checkbox"]'), ਡਿਵੈਲਪਰ ਇੱਕ ਫਾਰਮ ਅਤੇ ਏਪੀ ਵਿੱਚ ਸਾਰੇ ਚੈਕਬਾਕਸ ਦੁਆਰਾ ਕੁਸ਼ਲਤਾ ਨਾਲ ਦੁਹਰਾ ਸਕਦੇ ਹਨ