使用按鈕有兩個功能 - 顯示內容，並提交

Question

我有一個Bootstrap 3表單，在<button>元素上使用它的collapse()函數顯示。 然後，我會，一旦表格打開，有這個相同的按鈕成爲窗體上的提交按鈕。 但是，我不知道如何更改按鈕的功能第二次按。

示例代碼：

<form class="collapse" id="1234"> 
    <div class="form-group"> 
     <input class="form-control" type="text" placeholder="Name"> 
    </div> 
    <div class="form-group"> 
     <input class="form-control" type="email" placeholder="Email"> 
    </div> 
</form> 
<button class="btn btn-default btn-block" data-toggle="collapse" data-target="#1234">Open Form</button> 

jQuery函數準備代碼：

$(".btn-block").click(function() { 
    if ($.trim($(this).text()) == "Open Form") { 
     $(this).text("Submit Form"); 
    } else { 
     $(this).text("Open Form"); 
    } 
}); 

這裏是在動作切換一個的jsfiddle：http://jsfiddle.net/tzosozwv/

預先感謝。

Answer 1

呼叫submit()您form元素在你的if語句中：

if ($.trim($(this).text()) == "Open Form") { 
    $(this).text("Submit Form"); 
} else { 
    // Presumably this is where you want your form submitted... 
    $('form#1234').submit(); 
    $(this).text("Open Form"); 
} 

Answer 2

只需添加一個提交

$(".btn-block").click(function() { 
    if ($.trim($(this).text()) == "Open Form") { 
     $(this).text("Submit Form"); 
    } else { 
     $('#1234').submit(); 
     $(this).text("Open Form"); 
    } 
}); 

Answer 3

你好，這是所需的代碼。請享用。

$(".btn-block").click(function() { 
    if ($.trim($(this).text()) == "Open Form") { 
    $(this).text("Submit Form"); 
    $(this).on("click",callfunction); 
} else { 
    $(this).text("Open Form"); 
    $(this).off("click",callfunction); 
} 
}); 

function callfunction(){ 
    alert('ak'); 
}