单击一个按钮时禁用其余按钮

时间:2018-06-18 18:27:01

标签: javascript jquery

我有点击时显示表单的按钮。我正在尝试弄清楚如何在单击一个按钮后禁用其他按钮,以防止显示多个表单。我不擅长使用javascript,所以我感谢任何帮助。

例如,这里有两个显示表格的按钮。

$("#formButton").click(function () {
$("#form1").toggle();
});

$("#formButton2").click(function () {
$("#form2").toggle();
});

这是在单击按钮时显示表单的javascript函数。

{{1}}

6 个答案:

答案 0 :(得分:0)

你可以尝试这个disable button after submit 但是按钮的类型是$('form').submit(function() { $(this).find("button[type='button']").prop('disabled',true); });。所以,改为 <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginRight="15dp" android:gravity="center" android:orientation="horizontal" android:weightSum="5"> <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="4.5" android:text="Siavash.Ngh1" android:textColor="#fff" android:textSize="20dp" /> <ImageView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight=".5" android:src="@drawable/ic_settings" /> </LinearLayout>

答案 1 :(得分:0)

你可以尝试这个

--flaskwebsite
----routes.py
----routes.pyc
----templates
------frontend(other folders, javascript files etc)
------index.html

答案 2 :(得分:0)

您可以尝试这样的事情:

$("#formButton").click(function () {
if($('#formButton2').prop("disabled")) {
    $('#formButton2').attr("disabled", false);
  } else {
    $('#formButton2').attr("disabled", true);
  }
$("#form1").toggle();
});

$("#formButton2").click(function () {
if($('#formButton').prop("disabled")) {
    $('#formButton').attr("disabled", false);
  } else {
    $('#formButton').attr("disabled", true);
  }
$("#form2").toggle();
});

这将在单击时禁用相反的按钮,并在再次单击时重新启用它。

答案 3 :(得分:0)

这样的事情应该有效

&#13;
&#13;
$("#formButton").click(function() {
  $("#form1").toggle();
  $("#formButton2").prop('disabled', !$("#formButton2").prop("disabled"))
});

$("#formButton2").click(function() {
  $("#form2").toggle();
  $("#formButton").prop('disabled', !$("#formButton").prop("disabled"))
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button type="button" class="fbutton" id="formButton">1</button>
<button type="button" class="fbutton" id="formButton2">2</button>

<form id="form1" style="display:none">
  <h1>Form 1</h1>
</form>

<form id="form2" style="display:none">
  <h1>Form 2</h1>
</form>
&#13;
&#13;
&#13;

答案 4 :(得分:0)

在这种情况下,我经常建议使用.data()方法。

我稍后更改了HTML标记,以便添加import sys from PyQt5.QtWidgets import * from PyQt5.QtCore import * from PyQt5.QtGui import * from PyQt5.uic import loadUi class Tutorial(QTabWidget): #(QMainWindow): # QWidget def __init__(self): super(Tutorial, self).__init__() loadUi('FileNamingWidget.ui', self) print(self.Rb6.geometry(), self.Rb7.geometry(), self.Rb8.geometry()) print(self.Rb3.geometry(), self.Rb4.geometry(), self.Rb5.geometry(), self.Rb9.geometry()) print(self.Rb0.geometry(), self.Rb1.geometry(), self.Rb2.geometry()) print() self.Rb0.toggled.connect(self.rbChecked) self.Rb1.toggled.connect(self.rbChecked) self.Rb2.toggled.connect(self.rbChecked) self.Rb3.toggled.connect(self.rbChecked) self.Rb4.toggled.connect(self.rbChecked) self.Rb5.toggled.connect(self.rbChecked) self.Rb6.toggled.connect(self.rbChecked) self.Rb7.toggled.connect(self.rbChecked) self.Rb8.toggled.connect(self.rbChecked) self.Rb9.toggled.connect(self.rbChecked) def rbChecked(self): if self.sender().isChecked(): print(self.sender().objectName()) if __name__ == '__main__': app = QApplication(sys.argv) ex = Tutorial() ex.show() sys.exit(app.exec_()) 属性。

因此,在单击时,脚本将检索完成要显示的元素的“目标”data-*所需的值。

关于禁用任何其他按钮,id会过滤掉该集合中实际点击的按钮以停用。

.not(this)
$(document).ready(function(){
  $(".fbutton").on("click",function(){
    var target = $(this).data("formid");
    console.log(target);
    
    $(".fbutton").not(this).prop("disabled",true);
    $("#form"+target).show();
  });
});
form[id^='form']{
  display:none;
}

请注意,上述脚本可以根据需要使用多个按钮/表单对,而无需添加更多行。

答案 5 :(得分:0)

您可以禁用除活动按钮以外的所有按钮。您可以在按钮单击事件中添加更多功能。

$('input[type="radio"]').click(function() {
var $value1 = $('#value1');
var $value2 = $('#value2');

if($(this).attr('id') == 'radio1') { 
  $value1.data('previousvalue', $value1.val());
  $value1.val('1');

  $value2.data('previousvalue', $value2.val());
  $value2.val('0');


} else if($(this).attr('id') == 'radio2') {      
  $value1.val('0');
  $value2.val($value2.data('previousvalue'));
}
});