Question

我过去常常在carrd.co上主持一个带有pro plus计划的网站。我选择了昂贵的计划，因为可以下载网站并将其托管在自己的服务器上。

我不知道的是，这不包括服务器端代码。

我的问题是，我有前端代码，但我尝试的每个PHP代码都无法与此代码交互。由于我只能用Java开发，所以我无法自己找到解决方案。

问题是我不知道下一步是什么使这段代码在我的服务器上运行，以便在用户提交此表单时成功向我发送电子邮件。我没有任何后端代码，也不知道从哪里开始。

1）我可以在哪里放置PHP文件来回答此请求？我该怎么命名呢？

2）我如何解析参数？

3）我如何将php脚本的答案格式化为ajax脚本？

你能帮忙吗？非常感谢！！！

（如果您无法提供完整的解决方案，我甚至可以通过一些好的提示来解决这个问题！我感谢任何建议！）

前端代码：

形式：

<form id="form02" method="post">
                        <div class="inner">
                            <div class="field"><input type="text"       name="name" id="name" placeholder="Name"
                                                      maxlength="128"/></div>
                            <div class="field"><input type="email" name="email" id="email"
                                                      placeholder="Email" maxlength="128"/></div>
                            <div class="field"><input type="text" name="fname" id="-fname" placeholder="Fname"
                                                      maxlength="128"/></div>
                            <div class="field"><textarea name="message" id="message" placeholder="Message"
                                                         maxlength="16384"></textarea></div>
                            <div class="actions">
                                <button type="submit">Send Message</button>
                            </div>
                        </div>
                        <input type="hidden" name="id" value="form02"/>
</form>

脚本：

function form(id, settings) {
var _this = this;
this.id = id;
this.mode = settings.mode;
this.method = settings.method;
this.success = settings.success;
this.preHandler = ('preHandler' in settings ? settings.preHandler : null);
this.failure = ('failure' in settings ? settings.failure : null);
this.optional = ('optional' in settings ? settings.optional : []);
this.$form = $('#' + this.id);
this.$form.addEventListener('submit', function (event) {
    _this.submit(event);
});
this.$form.addEventListener('keydown', function (event) {
    if (event.keyCode == 13 && event.ctrlKey) {
        event.preventDefault();
        event.stopPropagation();
        _this.submit(event);
    }
});
var x = $('#' + this.id + ' input[name="' + settings.hid + '"]');
if (x) {
    x.disabled = true;
    x.parentNode.style.display = 'none';
}
this.$submit = $('#' + this.id + ' button[type="submit"]');
this.$submit.disabled = false;
};form.prototype.notify = function (type, message) {
if (message.match(/^(#[a-zA-Z0-9\_\-]+|[a-z0-9\-\.]+:[a-zA-Z0-  9\~\!\@\#$\%\&\-\_\+\=\;\,\.\?\/\:]+)$/)) location.href = message; else alert((type == 'failure' ? 'Error: ' : '') + message);
}; 

form.prototype.submit = function (event) {
var _this = this, result, handler, fd, k, x, $f, $ff;
event.preventDefault();
if (this.$submit.disabled) return;
result = true;
$ff = this.$form.elements;
for (k in $ff) {
    $f = $ff[k];
    if ($f.type != 'text' && $f.type != 'email' && $f.type != 'textarea' && $f.type != 'select-one') continue;
    if ($f.disabled) continue;
    if ($f.value === '' || $f.value === null) {
        if (this.optional.indexOf($f.name) !== -1) continue;
        result = false;
    } else {
        x = '';
        switch ($f.type) {
            case 'email':
                x = "^([a-zA-Z0-9\\_\\-\\.\\+]+)@([a-zA-Z0-9\\-     \\.]+)\\.([a-zA-Z]+)$";
                break;
            case 'select':
                x = "^[a-zA-Z0-9\\-]$";
                break;
            default:
            case 'text':
            case 'textarea':
                x = "^[^\\<\\>]+$";
                break;
        }
        result = result && $f.value.match(new RegExp(x));
    }
    if (!result) break;
}
if (!result) {
    this.notify('failure', 'Missing and/or invalid fields. Please try again.');
    return;
}
if (_this.method == 'get') {
    _this.$form.submit();
    return;
}
if (x = $(':focus')) x.blur();
this.$submit.disabled = true;
this.$submit.classList.add('waiting');
handler = function (values) {
    var x, k, data;
    data = new FormData(_this.$form);
    if (values) for (k in values) data.append(k, values[k]);
    x = new XMLHttpRequest();
    x.open('POST', ['', 'post', _this.mode].join('/'));
    x.send(data);
    x.onreadystatechange = function () {
        var result = false, message = 'Sorry, something went wrong. Please try again later.', alert = true, o;
        if (x.readyState != 4) return;
        if (x.status == 200) {
            o = JSON.parse(x.responseText);
            if (o) {
                if ('result' in o) result = (o.result === true);
                if (('message' in o) && o.message) message = o.message;
                if ('alert' in o) alert = (o.alert === true);
            }
        }
        _this.$submit.classList.remove('waiting');
        if (result) {
            _this.$form.reset();
            if (alert) window.alert(message); else _this.notify('success', (_this.success ? _this.success : message));
        } else {
            if (alert) window.alert(message); else _this.notify('failure', (_this.failure ? _this.failure : message));
        }
        _this.$submit.disabled = false;
    };
};
if (_this.preHandler) (_this.preHandler)(_this, handler); else (handler)();
};
new form('form02', {mode: 'contact', method: 'post', hid: 'fname', success: '#contact-done',});

Answer 1

html表单通常使用action参数来指定脚本提交表单数据的URL。但是看起来您的javascript代码是硬编码的，可以在/post/contact处创建一个回复到网址的ajax帖子，这可以解释为什么您尝试过的示例无效。

是的，您确实需要服务器上的某种脚本来处理响应，但它不必是PHP - 无论您的托管服务提供商支持什么，以及能够处理您想要做什么的任何内容与数据。

需要联系表格后端，前端

1 个答案: