Question

我使用此脚本打开已存在的自定义子域。由于我开始使用ajax作为联系表单，因此无法使用。

错误：（jquery.js：4 XMLHttpRequest无法加载javascript：newDoc（）。交叉源请求仅支持协议方案：http，data，chrome，chrome-extension，https，chrome-extension-resource。）< / p>

有人可以帮帮我吗？

SCRIPT

<script>
    function newDoc() {
    window.location.href = "http://" + $("#domain").val() + ".mywebsite.com";
}</script>

HTML

<form action="JavaScript:newDoc()" method="post" role="form" id="login-form" class="cd-form">
  <div class="row">
   <div class="col-xs-12 text-center sign-in-text">
    <p>Enter your company's <span>MyWebsite domain.</span></p>
  </div>
 <div class="user-box-1 col-xs-8">
  <input type="text" name="domain" id="domain" class="form-control" placeholder="Domain" value="" required="">
 </div>
 <div class="text-domain col-xs-4">
  .mywebsite.com
 </div>
 </div>
 <p class="fieldset">
 <button class="full-width" type="submit">Continue</button>
 </p>
</form>

Answer 1

发生这种情况的原因是因为您正在使用“javascript：”URI，并且AJAX处理将此作为目标。

以下是一个例子：

https://jsfiddle.net/L4z0Le4f/

function foo() {
   return 'https://api.ipify.org/';
}

var xhr = new XMLHttpRequest();
xhr.open('GET', 'javascript:foo()');
xhr.onload = function () {
  console.log('Loaded');
}
xhr.onerror = function () {
  console.log('Failed');
}
xhr.send();

这也将失败。看起来你的表单真正想要的行为是在提交时执行JavaScript函数，而根本不使用AJAX。

这可以通过'submit'事件处理程序更好地处理，例如（使用jQuery）：

$('#login-form').on('submit', function () {
  newDoc();
  return false;
};

如果您确实希望在单击提交时发布到该URL，则可以在提交处理程序中更改操作值。这是一个例子：

https://jsfiddle.net/bu1j00Le/

<form action="javascript:alert(1);" method="post">
  <input type="text" name="testing" id="q" />
  <button type="submit">Make it happen</button>
</form>

$('form').on('submit', function () {
  this.action = '/echo/js/?js=' + encodeURIComponent(JSON.stringify($('#q').val()));
});

当然，它取决于事件触发的顺序 - 如果AJAX代码正在侦听提交事件，它可能会在此新处理程序执行之前拦截它。为了避免这种情况，您还可以在字段上使用“更改”事件处理程序以非常类似的方式改变表单操作：

$('#domain').on('change', function () {
  $('#login-form').prop('action', 'http://' + $("#domain").val() + '.mywebsite.com');
});

Answer 2

使用此

function newDoc() {
    return "http://" + $("#domain").val() + ".mywebsite.com";
}

得到此错误：XMLHttpRequest无法加载javascript：newDoc（）

2 个答案: