<form action=""> <div class="form-group"> <input type="search" name="search-field" placeholder="Search Here..." required> <button type="submit"><i class="far fa-search"></i></button> </div> </form>怎么跳转界面时加一个参数

在该表单中，可以在 `action` 属性中指定表单提交时的 URL。如果需要在跳转时传递参数，可以在该 URL 中添加查询参数来实现。例如：

<form action="/example?foo=bar">         
  <div class="form-group">             
    <input type="search" name="search-field" placeholder="Search Here..." required>             
    <button type="submit"><i class="far fa-search"></i></button>         
  </div>     
</form>

上述代码将会在表单提交时跳转到 `/example` 页面，并且在跳转时传递了一个名为 `foo` 值为 `bar` 的参数。在目标页面中，可以通过 JavaScript 来获取传递的参数。例如：

const urlParams = new URLSearchParams(window.location.search);
const foo = urlParams.get('foo');
console.log(foo);  // 输出：bar

使用上述方法可以实现在表单提交时传递参数的功能。

相关问题

<form class="layui-form" action=""> <div class="layui-form-item"> <label class="layui-form-label">报表名称</label> <div class="layui-input-block"> <input type="text" name="reportName" required lay-verify="required" placeholder="请输入报表名称" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">报表组</label> <div class="layui-input-block"> <select name="reportGroup" lay-verify="required"> <option value=""></option> <option value="group1">分组1</option> <option value="group2">分组2</option> <option value="group3">分组3</option> </select> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">报表路径</label> <div class="layui-input-block"> <input type="text" name="reportUrl" required lay-verify="required" placeholder="请输入报表路径" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">报表抽样条件路径</label> <div class="layui-input-block"> <input type="text" name="reportCdnUrl" required lay-verify="required" placeholder="请输入抽样条件路径" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">是否启用</label> <div class="layui-input-block"> <input type="checkbox" name="enable" lay-skin="switch" lay-filter="switchTest" lay-text="启用|禁用"> </div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" lay-submit lay-filter="formDemo">提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> </div> </div> </form> 调整label的宽度为200

可以通过修改CSS样式来调整label的宽度为200，代码如下：

<style>
    .layui-form-label {
        width: 200px;
    }
</style>

将上述代码放在HTML代码之前或者在外部CSS文件中即可。

<form id="upload" action="http://localhost:9091/User/addWork/" method="post" enctype="multipart/form-data"> <div class="form-group"> <label>作评名称</label> <input id="name" name="work.name" type="text" class="form-control" placeholder="作品名称"> </div> <div class="form-group"> <label>摄影时间</label> <input id="shootingDate" name="work.shootingDate" type="text" class="form-control" placeholder="拍摄时间"> </div> <div class="form-group"> <label>拍摄地点</label> <input id="shootingAddress" name="work.shootingAddress" type="text" class="form-control" placeholder="拍摄地址"> </div> <div class="form-group"> <label>上传文件</label><br/> <input type="file" name="file"> </div>

这是一个表单代码，其中包括作品名称、摄影时间、拍摄地点和上传文件的输入框，表单的提交地址为"http://localhost:9091/User/addWork/"，提交方式为POST。其中`enctype="multipart/form-data"`表示该表单数据是以二进制流的方式上传的，适用于文件上传等场景。