Question

我查看了很多线程，似乎无法找到解决问题的方法。我是javascript的新手，我正在寻找帮助，允许我的页面运行javascript并通过单击一个提交按钮提交表单。我正在使用codeigniter，并且正在调用一个名为uploadEx（）的javascript函数;将画布提交到目录。提交到目录单独工作，但不是与表单提交相同的按钮。如果有人可以帮助我让按钮共享两个很棒的动作。

<div>

    </div>

    <form method="post" accept-charset="utf-8" name="form1">
        <input name="hidden_data" id='hidden_data' type="hidden"/>
    </form>

    <script>
        function uploadEx() {
            var canvas = document.getElementById("canvasSignature");
            var dataURL = canvas.toDataURL("image/png");
            document.getElementById('hidden_data').value = dataURL;
            var fd = new FormData(document.forms["form1"]);

            var xhr = new XMLHttpRequest();
            xhr.open('POST', '/inc/img/inspection/upload_data.php', true);
            document.forms["form"].submit();

            xhr.upload.onprogress = function(e) {
                if (e.lengthComputable) {
                    var percentComplete = (e.loaded / e.total) * 100;
                    console.log(percentComplete + '% uploaded');
                   //alert('Succesfully uploaded');
                }

            };

            xhr.onload = function() {

            };
            xhr.send(fd);
        };
    </script
<div align="center">

  <?php if( !function_exists('form_open')): ?>
  <?php $this->load->helper('form'); ?>
  <?php endif;?>
  <form  id="form" onClick="uploadEx(); return true;" method="post">



  <?php echo form_label('Trailer Number','trlr_num'); ?>
  <?php echo form_input(array('name'=>'trlr_num','type'=>'text')); ?>

  <?php echo form_label('Seal','seal'); ?>
  <?php echo form_input(array('name'=>'serial_num','type'=>'text')); ?>


  <?php echo form_fieldset_close(); ?>
  <br />

  <input type="submit" name="submit" value="submit" content="submit"/>
<?php echo form_close(); ?>

Answer 1

我能够通过使用Imran Qarner的建议解决我的问题，将onsubmit事件移出调用codeigniter的php代码。

Answer 2

您是否尝试过onsubmit事件而不是onclick？我认为它会对你有用。此外，您的第一个<form>.......</form>的功能是什么？

提交的HTML表单和javascript无法正常工作

2 个答案: