如何使用外部 js 文件访问表单？如何对客户端隐藏js的敏感内容？答案

【问题标题】：how to acess form with external js files? how to hide sensitive content of js from client?如何使用外部 js 文件访问表单？如何对客户端隐藏js的敏感内容？
【发布时间】：2018-03-24 13:26:46
【问题描述】：

我正在使用 emailjs 通过我的免费子域网站发送电子邮件。它有两个问题 1）。我的 emailjs 帐户 ID、服务 ID 和模板 ID 正在公开，因此任何人都可以访问它并通过它发送电子邮件。 2）。为了解决它，我使用了以下代码，但它出现在浏览器“检查元素”（开发工具）中。

     <?php echo "
<script>
   (function(){
      emailjs.init(my user id);
   })();
</script>" ; ?>
    <?php
      echo "<script src='js/formfilled.js'></script>"; 
    ?>

现在我的表单提交按钮是这样的

    <button onclick="email();">
         Send
    </button>

现在我的表单填写文件是这样的

var myform = $("form#myform");
function email(){

  var service_id = "default_service";
  var template_id = "xxxxxxxxx";

  myform.find("button").text("Sending...");
  emailjs.sendForm(service_id,template_id,"myform")
    .then(function(){ 
        alert("Sent!");
       myform.find("button").text("Send");
    }, function(err) {
       alert("Send email failed!\r\n Response:\n " + JSON.stringify(err));
       myform.find("button").text("Send");
    });
}

问题是当我单击按钮而不是发送电子邮件时，它会重新加载页面。对不起，如果它太傻了，我完全是初学者，提前谢谢。

更新如果我将代码放在同一个文件中（不使用外部 js），它就可以工作代码：--

    <head>
              <script type="text/javascript">
   (function(){
      emailjs.init("xxxxxxxxxxxxxxxxxxxxx");
   })(); </head>
</script>
<body>
            <!-- form is here-->
<script>

var myform = $("form#myform");
myform.submit(function(event){
    event.preventDefault();

  // Change to your service ID, or keep using the default service
  var service_id = "default_service";
  var template_id = "xxxxxxxxxxxxxxxxxxx";

  myform.find("button").text("Sending...");
  emailjs.sendForm(service_id,template_id,"myform")
    .then(function(){ 
        alert("Sent!");
       myform.find("button").text("Send");
    }, function(err) {
       alert("Send email failed!\r\n Response:\n " + JSON.stringify(err));
       myform.find("button").text("Send");
    });
  return false;
});
</script>
</body>

但如果我将此代码放在 formfilled.js 中，它就不起作用。背后的原因是什么？

【问题讨论】：

button 默认类型是 submit 这可能解释了您的部分问题
@gaetanoM 感谢您的关注，请查看已更新的代码
完美！您添加了 event.preventDefault(); 对于其他问题，您可以查看 How to hide or secure javascript code from client side
@gaetanoM 仍然如果我将相同的代码放在外部文件中它不起作用。为什么？
看看DOMContentLoaded

标签： javascript php html forms submit-button

【解决方案1】：

回答：使用

 event.preventDefault();

并在加载按钮之前加载文件。

【讨论】：