Jquery เพื่อเปลี่ยนการกระทำของฟอร์ม

ฉันมีปุ่มสองปุ่มในแบบฟอร์มและต้องเรียกสองหน้าที่แตกต่างกันเมื่อมีการคลิก เมื่อคลิก button1 แล้วต้องโหลด page1 และเมื่อคลิก button2 แล้วต้องโหลด page2 ฉันรู้วิธีทำใน javascript แต่ฉันไม่รู้วิธีทำใน jquery มีใครช่วยฉันได้บ้าง

ลองสิ่งนี้:

$('#button1').click(function(){
   $('#formId').attr('action', 'page1');
});


$('#button2').click(function(){
   $('#formId').attr('action', 'page2');
});

jQuery เป็นเพียง JavaScript อย่าคิดต่างไปจากนี้! เช่นเดียวกับที่คุณทำใน JS "ปกติ" คุณเพิ่มตัวฟังเหตุการณ์ลงในปุ่มและเปลี่ยนแอตทริบิวต์การดำเนินการของแบบฟอร์ม ใน jQuery จะมีลักษณะดังนี้:

$('#button1').click(function(){
   $('#your_form').attr('action', 'http://uri-for-button1.com');
});

รหัสนี้เหมือนกันสำหรับปุ่มที่สองคุณจะต้องเปลี่ยน id ของปุ่มและ URI ที่ควรส่งแบบฟอร์มเท่านั้น

ใช้jQuery.attr()ในตัวจัดการคลิกของคุณ:

$("#myform").attr('action', 'page1.php');

เพื่อประโยชน์ของความหลากหลาย:

var actions = {input1: "action1.php", input2: "action2.php"};
$("#input1, #input2").click(function() {
    $(this).closest("form").attr("action", actions[this.id]);
});

โปรดดูคำตอบนี้: https://stackoverflow.com/a/3863869/2096619

อ้างถึงTamlyn :

jQuery (1.4.2) จะสับสนหากคุณมีองค์ประกอบของฟอร์มชื่อ "action" คุณสามารถหลีกเลี่ยงปัญหานี้ได้โดยใช้วิธีแอตทริบิวต์ DOM หรือเพียงแค่หลีกเลี่ยงการมีองค์ประกอบของฟอร์มที่ชื่อ "action"

<form action="foo">
  <button name="action" value="bar">Go</button>
</form>

<script type="text/javascript">
  $('form').attr('action', 'baz'); //this fails silently
  $('form').get(0).setAttribute('action', 'baz'); //this works
</script>

$('#button1').click(function(){
$('#myform').prop('action', 'page1.php');
});

หากต้องการเปลี่ยนค่าการดำเนินการของฟอร์มแบบไดนามิกคุณสามารถลองใช้โค้ดด้านล่าง:

โค้ดด้านล่างนี้คือถ้าคุณกำลังเปิดกล่อง dailog และในกล่อง dailog ที่คุณมีแบบฟอร์มและคุณต้องการเปลี่ยนการกระทำของมัน ฉันใช้ Bootstrap dailog box และเมื่อเปิดกล่อง dailog นั้นฉันกำลังกำหนดค่าการดำเนินการให้กับแบบฟอร์ม

$('#your-dailog-id').on('show.bs.modal', function (event) {
    var link = $(event.relatedTarget);// Link that triggered the modal
    var cURL= link.data('url');// Extract info from data-* attributes
    $("#delUserform").attr("action", cURL);
});

หากคุณกำลังพยายามเปลี่ยนการดำเนินการแบบฟอร์มในหน้าปกติให้ใช้โค้ดด้านล่าง

$("#yourElementId").change(function() { 
  var action = <generate_action>;
  $("#formId").attr("action", action);
});