मैं अपने फॉर्म के नीचे पाठ प्राप्त करने की कोशिश कर रहा हूं2 रेडियो बटन "हां" या "नहीं" की अपनी पसंद के आधार पर बदलें। मेरे पास एक फ़ंक्शन मिलता है कैट जो चयनित रेडियो बटन पर catVal सेट करता है। फ़ंक्शन शोकैट्स में एक कथन है जो catVal के मान के आधार पर पाठ को बदलता है। जमा करें फॉर्म के लिए सबमिट बटन की आईडी है और बिल्ली हां और कोई रेडियो बटन का नाम नहीं है।
वर्तमान में ऑन क्लिक फ़ंक्शन काम नहीं कर रहा है, अलर्ट कभी प्रकट नहीं होता है।
$(document).ready(function(){
$("#submit").click(function(){
alert("k");
getCats();
});
});
function getCats() {
var cats = $([name="cat"]);
var catVal;
for(var i = 0; i < cats.length; i++){
if(cats[i].checked){
catVal = cats[i].value;
}
}
showCats();
}
function showCats(){
alert("show");
if (catVal == "yes"){
$("#catReact").text("Hello fellow cat lover!");
}
if (catVal == "no"){
$("#catReact").text("I guess you must be a dog person.");
}
}
उत्तर:
उत्तर № 1 के लिए 1आपके कोड में कई बदलाव आवश्यक हैं।
- आपको चयनकर्ता को बदलने की जरूरत है। लूप के लिए प्रत्येक रेडियो बटन की जांच करने के बजाय रेडियो समूह नाम का उपयोग करना बेहतर है।
- catValue फ़ंक्शन के लिए पैरामीटर होना चाहिए ताकि यह पुन: प्रयोज्य हो सके।
पृष्ठ रीफ्रेश से बचने के लिए आपको सबमिट करने के बजाय एक बटन का उपयोग करना चाहिए
Here is working plunker: [Plunker][1]
यहां कोड है:
$(document).ready(function(){
$("#submit").click(function(){
alert("k");
getCats();
}); });
function getCats() {
var catVal= $("[name="cat"]:checked").val();;
showCats(catVal); }
function showCats(catVal){
alert(catVal);
console.log($("#catReact"))
if (catVal == "yes"){
$("#catReact").text("Hello fellow cat lover!");
}
if (catVal == "no"){
$("#catReact").text("I guess you must be a dog person.");
}
}<!DOCTYPE html>
<html>
<head>
<script data-require="jquery@*" data-semver="3.1.1" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<h1>Hello Plunker!</h1>
<form action="">
<input type="radio" id="radio1" name="cat" value="yes"> Cat<br>
<input type="radio" id="radio2" name="cat" value="no"> Dog<br>
<input type="button" id="submit" value="submit">
<div id="catReact" ></div>
</form>
</body>
</html>उत्तर № 2 के लिए 1
आपके पास एक से अधिक मुद्दे हैं:
- गणना करने के लिए catVal आप बस लिख सकते हैं: $ ("[name =" cat "]: चेक किया गया")। val ()
- फ़ंक्शन शोकैट को पिछले catVal इनपुट के रूप में आवश्यक है
$(document).ready(function () {
$("#submit").click(function (e) {
e.preventDefault();
getCats();
});
});
function getCats() {
var catVal = $("[name="cat"]:checked").val();
showCats(catVal);
}
function showCats(catVal) {
if (catVal == "yes") {
$("#catReact").text("Hello fellow cat lover!");
}
if (catVal == "no") {
$("#catReact").text("I guess you must be a dog person.");
}
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="">
<input type="radio" name="cat" value="yes"> I love cats<br>
<input type="radio" name="cat" value="no" checked> I dislike cats<br>
<input type="submit" id="submit" value="Submit">
</form>
<p id="catReact"></p>जवाब के लिए 0 № 3
जमा करें फॉर्म के लिए सबमिट बटन की आईडी है
मुझे संदेह है कि जब आप कोई फॉर्म सबमिट करते हैं तो आपकी समस्या ब्राउज़र पुनर्निर्देशन से संबंधित है ... मुझे लगता है कि आपको निम्न कोड आज़माएं:
$("form").submit(function (e) {
e.preventDefault();
alert("k");
getCats();
});