Das Aktivieren/Deaktivieren einer Schaltfläche mithilfe von jQuery erfordert die Änderung ihrer Funktionalität, um Benutzereingaben entweder zu akzeptieren oder nicht. Dies geschieht normalerweise durch Manipulation der Eigenschaft oder des Attributs „disabled“ über jQuery-Methoden wie „.prop()“ oder „.attr()“.
while-Schleife Java
Um eine Schaltfläche mit jQuery zu aktivieren/deaktivieren, benötigen Sie eine grundlegende HTML-Struktur zusammen mit JavaScript/jQuery. Nachfolgend finden Sie eine einfache Codestruktur, die Ihnen den Einstieg erleichtert
HTML Schaltfläche „Aktivieren/Deaktivieren“Titel><script src= 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js'>Skript> Kopf> <body> <button id='myButton'>Klicken Sie auf die Schaltfläche „Ich“.<script>$(document).ready(function(){ // jQuery-Code zum Aktivieren/Deaktivieren der Schaltfläche // Fügen Sie hier Ihren Code hinzu }); script> body> html>></pre> </code> <p dir='ltr'> <br></p> <br><div id="container-4ae8242bd8e42d94c5c0bf390d5144e6"></div><br> <h2><span>Beispiele für das Aktivieren/Deaktivieren einer Schaltfläche mithilfe von jQuery</span></h2><h3><span>1. Verwendung der .prop()-Methode:</span></h3><p dir='ltr'><span>Benutzen</span> <span>.prop() in jQuery</span> <span>Um eine Schaltfläche zu aktivieren/deaktivieren, muss ihre Eigenschaft „disabled“ auf „true“ oder „false“ gesetzt werden, was eine effiziente Kontrolle über ihre Interaktivität basierend auf Anwendungsanforderungen und Benutzerinteraktionen ermöglicht.</span></p> <p dir='ltr'> <b> <strong>Beispiel:</strong> </b> <span>In diesem Beispiel verwenden wir jQuery: Schaltet die Eigenschaft „disabled“ der Schaltfläche bei Klick- und Doppelklickereignissen um, um eine reibungslose Benutzerinteraktion mithilfe der Methode .prop() zu gewährleisten.</span></p>HTML<code class='hljs'> <pre class='hljs'> <html> <head> <script src= 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js'>Skript> Kopf> <body> <h3>Verwenden der .prop()-Methodeh3> <button id='update'>„Aktualisiere mich“-Schaltfläche><div style='margin-top: 50px'> <button id='change'>Klicken Sie auf die Schaltfläche „Mebutton“> „div“><script>$('#change').on('click', function () { $('#update').prop( 'disabled', true ); }); $('#change').on( 'dblclick', function () { $('#update').prop( 'disabled', false ); } ); script> body> html>></pre> </code> <p dir='ltr'> <b> <strong>Ausgabe:</strong> </b> </p> <img src='//techcodeview.com/img/blogathon-2021/17/how-enable-disable-button-using-jquery.webp' alt="JqueryToggle"><p>Beispielausgabe der Methode .prop()</p><blockquote style="text-transform: capitalize;font-size: 20px; padding: 10px;"><a href="/dart-lists">Dart-Liste</a>
</blockquote> <h3><span>2. Verwendung der .attr()-Methode</span></h3><p dir='ltr'><span>Verwendung der</span> <span>.attr()-Methode</span> <span>In jQuery schalten Sie das Attribut „disabled“ von Elementen um. Durch Klicken auf eine Schaltfläche wird eine andere Schaltfläche deaktiviert, durch Doppelklicken wird sie erneut aktiviert, wodurch die Benutzerinteraktion und Funktionalität innerhalb von Webseiten verbessert wird.</span></p> <p dir='ltr'> <b> <strong>Beispiel:</strong> </b> <span>In diesem Beispiel verwenden wir die Methode .attr(), um die Schaltfläche zu aktivieren/deaktivieren. Durch Klicken wird eine andere Schaltfläche deaktiviert. Durch einen Doppelklick wird es wieder aktiviert, wodurch die Benutzerinteraktion und die Webfunktionalität verbessert werden.</span></p>HTML<code class='hljs'> <pre class='hljs'> <html> <head> <script src= 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js'>Skript> Kopf> <body> <h3>Verwenden der .attr()-Methodeh3> <button id='update'>Klicken Sie auf die Schaltfläche „Mich aktualisieren“.<div style='margin-top: 50px;'> <button id='change'>Klicken Sie auf die Schaltfläche „Me“> „div>“.<script>$('#change').on('click', function () { $('#update').attr('disabled', 'disabled'); }); $('#change').on('dblclick', function () { $('#update').removeAttr('disabled'); }); script> body> html>></pre> </code> <p dir='ltr'> <b> <strong>Ausgabe:</strong> </b> </p> <p> <br></p><blockquote style="text-transform: capitalize;font-size: 20px; padding: 10px;"><a href="/apache-spark-tutorial">Spark-Tutorial</a>
</blockquote> <img src='//techcodeview.com/img/blogathon-2021/17/how-enable-disable-button-using-jquery-2.webp' alt="JqueryToggle2"><p>.attr()-Methode Beispielausgabe</p> <p> <br></p> <br> <br></article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></div> </article>
</div><!--//content-->
</div><!--//section-inner-->
</section><!--//section-->
</div><!--//primary-->
<div class="secondary col-md-4 col-sm-12 col-xs-12">
<aside class="info aside section">
<div class="section-inner">
<h2 class="">Kategorie</h2>
<div class="content">
<ul class="list-unstyled">
<li> <a href="/android/">Android</a> </li><li> <a href="/geeks-premier-league-2023-cat/">Geeks Premier League 2023</a> </li><li> <a href="/listicles/">Listicles</a> </li><li> <a href="/jpa-tutorial/">Jpa-Tutorial</a> </li><li> <a href="/java-character-class/">Java-Zeichenklasse</a> </li><li> <a href="/c-map-function/">C++-Kartenfunktion</a> </li><li> <a href="/git-tutorial/">Git-Tutorial</a> </li><li> <a href="/python-file-handling/">Python-Dateiverwaltung</a> </li><li> <a href="/java-method-class/">Java-Methodenklasse</a> </li><li> <a href="/cpp-input-output/">Cpp-Eingabe-Ausgabe</a> </li>
</ul>
</div><!--//content-->
</div><!--//section-inner-->
</aside><!--//aside-->
<aside class="testimonials aside section">
<div class="section-inner">
<div class="content">
<div class="item">
<div class="rekl_placeholder" id="sidebar_placeholder_1"> <script type="text/javascript">atOptions = {'key' : 'f53f1abf3c3a788f849c12a956865db1','format' : 'iframe','height' : 300,'width' : 160,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f53f1abf3c3a788f849c12a956865db1/invoke.js"></script> <br></div>
</div>
</div>
</div>
<div class="section-inner">
<h2 class="heading">Exponential() in C</h2>
<div class="content">
<div class="item">
<blockquote class="quote">
<span> <i class="fa fa-quote-left"></i> Exponential() in C mit Tutorial, C-Sprache mit Programmierbeispielen für Anfänger und Profis zu Konzepten, C-Zeigern, C-Strukturen, C-Union, C-Strings usw.</span>
</blockquote>
</div><!--//item-->
<p> <a class="more-link" href="/exponential-c"> <i class="fa fa-external-link"></i> Weiterlesen</a> </p>
</div><!--//content-->
</div><!--//section-inner-->
</aside><!--//section-->
<aside class="languages aside section">
<div class="section-inner">
<h2 class="heading">Interessante Artikel</h2>
<div class="content">
<ul class="list-unstyled">
<li class="item">
<span class="title"> <strong> <a href="/decision-making-c-if">Entscheidungsfindung in C (if, if..else, Nested if, if-else-if)</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/how-get-5-0-gpa-13130">So erhalten Sie einen Notendurchschnitt von 5,0: Expertenratgeber</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/java-static-keyword">Statisches Java-Schlüsselwort</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/file-handling-in-java-using-filewriter-and-filereader">Dateiverwaltung in Java mit FileWriter und FileReader</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/rot13-cipher">ROT13-Verschlüsselung</a> </strong> </span>
</li><!--//item-->
</ul>
</div><!--//content-->
</div><!--//section-inner-->
</aside><!--//section-->
<aside class="list music aside section">
<div class="section-inner">
<h2 class="heading">Beliebte Beiträge</h2>
<div class="content">
<ul class="list"> <li><a href="/fiscal-quarters-q1-q2">q1 q2 q3 q4</a>
</li><li><a href="/sql-case">Was ist in SQL der Fall?</a>
</li><li><a href="/what-is-chmod-755">755 chmod</a>
</li><li><a href="/binary-search-algorithm">binärer Suchalgorithmus</a>
</li><li><a href="/symmetric-difference-between-two-sets">symmetrischer Unterschied</a>
</li><li><a href="/java-convert-string-int">Konvertieren Sie einen String in int</a>
</li>
</ul>
</div><!--//content-->
</div><!--//section-inner-->
</aside><!--//section-->
</div><!--//secondary-->
</div><!--//row-->
</div><!--//masonry-->
<footer class="footer">
<div class="container text-center">
<span>
Copyright ©2025 Alle Rechte Vorbehalten | <a href="//ca.techcodeview.com/">techcodeview.com</a> | <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Haftungsausschluss</a> | <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Über Uns</a> | <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Datenschutzrichtlinie</a> </span>
</div>
</footer>
<script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="https://techcodeview.com/template/assets/js/main.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/highlight.min.js"></script>
<script>
!function(){"use strict";let t=document.createElement("button");t.id="toTopBtn",t.innerHTML="↑";let e=`
#toTopBtn {
position: fixed;
bottom: 25px;
right: 25px;
z-index: 9999;
opacity: 0;
visibility: hidden;
background-color: #213141;
color: white;
border: none;
border-radius: 8px;
width: 50px;
height: 50px;
font-size: 24px;
cursor: pointer;
transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
#toTopBtn:hover {
background-color: #555;
}
`,i=document.createElement("style");i.type="text/css",i.innerText=e,document.head.appendChild(i),document.body.appendChild(t),window.addEventListener("scroll",()=>{let e=window.scrollY||document.documentElement.scrollTop;e>300?(t.style.opacity="1",t.style.visibility="visible"):(t.style.opacity="0",t.style.visibility="hidden")}),t.addEventListener("click",()=>{window.scrollTo({top:0,behavior:"smooth"})})}();
</script>
</body>
</html>