伪前端笔记

假装我是一个前端。

1.form 表单中 input输入框 ，若添加disabled属性限制加载，form表达上传时则不会上传该input，可用readonly="readonly"只读属性，另外要上传内容还需用name属性便于后台接收。

<form id="update" action="/updateAcceptance" method="post">
    <div id="sheet1">
        <h3>一、标准验收卡</h3>
        <h4>1、中压架空线路</h4>
        <table class="table table-bordered tables" id="table1">
            <tr>
                <td colspan="4">工程名称</td>
                <td colspan="6" contenteditable="false"><input type="text" class="form-control" name="projectName" value="<%- acceptancetb[0].projectName%>" readonly="readonly"></td>
                <td colspan="1">工程<br>编号</td>
                <td colspan="3" contenteditable="true"><input type="text" class="form-control" name="projectNumber" value="<%- acceptancetb[0].projectNumber%>" disabled></td>

2.在使用viwer JQ图片查看器时，遇到点击放大后图片不居中的问题，经检查，是由于id 放在了 相对内层的一个row里，将id放到相对外层即可，原因应该是有关相对位置。

<div class="wrapper wrapper-content animated fadeInRight" id="photoViwer">
......
</div>

$("#photoViwer").viewer();

3.使用form表单时，为了回调函数，用$.post 方法来提交表单数据并接收服务端返回值，要注意执行 event.preventDefault();该方法阻止元素发生默认的行为（例如，当点击提交按钮时阻止对表单的提交）。目的是为了在接收到返回值后弹窗“工程名已存在，请重新输入”，点“确定”后页面不刷新，原先填的值保留在页面上，用户不需要重新输入所有信息。

    $("#sub").click(function (event) {
        event.preventDefault();
        var formData = {
            projectName: $("#projectName").val(),
            projectNumber: $("#projectNumber").val(),
            projectNature: $("#projectNature").val()
        }
        $.post("/acceptanceList", formData, function (result) {
            if (result) {
                console.log(result);
                if (result.errorCode === 1) {
                    alert('创建工程成功！');
                    location.reload('/acceptance');
                } else {
                    alert('工程名已存在，请重新输入');
                }
            }
        });
    });