Wie erstellt man ein Checkbox-Formular in jquery?

Question

Ich bin neu in jQuery und habe damit zu kämpfen. Ich bin auf diese Website gestoßen, um Hilfe zu bekommen. Ich muss eine Checkbox-Liste erstellen, die, wenn ich ein oder mehrere Kontrollkästchen anklicke, dann auf Senden klicke, es zeigt einen Namen und eine Link-Kombination. Also, wenn ich eine Liste von Ressourcen im Checkbox-Format habe und ich auf die Schreib- und Mathe-Checkboxen klicke, dann klicke auf Senden, es wird mir das Wort schreiben geben. Wenn ich auf dieses Wort klicke, wird es mich auf eine Schreibseite bringen. Hier ist die Liste Ich habe und die Submit-Button

<h2 id="studentr">Student Resources</h2> 

<section id="information"> 
<div id="studentbox"> 
<p id="choose">Choose at least one resource and click the 'Show Me' button to display links to selected resources</p> 

<form id="checkboxlist" action=""> 
<input type="checkbox" name="Career Preparation" id="career" value="https://students.asu.edu/careerguide/careerpreparation">Career Preparation<br> 
<input type="checkbox" name="College Advising" id="advising" value="https://http://poly.engineering.asu.edu/advising">College Advising<br> 
<input type="checkbox" name="Counseling Services" id="counseling" value="https://students.asu.edu/counseling">Counseling Services<br> 
<input type="checkbox" name="Finanical Aid" id="fiancialaid" value="https://students.asu.edu/financialaid">Finanical Aid<br> 
<input type="checkbox" name="Fitness and Recreation" id="fitnessandrecreation" value="http://fitness.asu.edu/">Fitness and Recreation<br> 
<input type="checkbox" name="Health Services" id="healthservices" value="https://students.asu.edu/health">Health Services<br> 
<input type="checkbox" name="Housing" id="housing" value="http://housing.asu.edu/home">Housing<br> 
<input type="checkbox" name="Library" id="library" value="http://lib.asu.edu/">Library<br> 
<input type="checkbox" name="Parking" id="parking" value="https://cfo.asu.edu/pts">Parking<br> 
<input type="checkbox" name="scholarships" id="scholarships" value="https://students.asu.edu/scholarships">Scholarships<br> 
<input type="checkbox" name="Student Employment" id="employment" value="https://students.asu.edu/employment">Student Employment<br> 
<input type="checkbox" name="Student Organizations" id="organizations" value="http://asu.orgsync.com/">Student Organizations<br> 
<input type="checkbox" name="Tutoring Support" id="tutoring" value="https://tutoring.asu.edu/">Tutoring Support<br> 
<input type="checkbox" name="Writing Support" id="writing" value="https://tutoring.asu.edu/writing-centerst">Writing Support<br> 
</form> 


<button id="RB1" type="button">Show Me the Resources</button> 
</div> 

</section> 

<div id="results"> 
<h3 id="pr">Results</h3> 
<p id="statement">You have selected:</p> 
</div> 

Answer 1

versuchen Sie folgendes:

$('#RB1').click(function() { 
    var text = ''; 
    $('[type="checkbox"]:checked').each(function(i, el) { 
    text += '<a href="' + $(el).attr('value') + '">' + $(el).attr('name') + '</a></br>' 
    }); 
    $('#statement').append(text); 
}); 

https://jsfiddle.net/cy0dhLs7/