小程序如何一次提交多个FormId

最新推荐文章于 2024-06-07 08:00:00 发布

原创最新推荐文章于 2024-06-07 08:00:00 发布 · 1.3k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#小程序 #css

小程序专栏收录该内容

1 篇文章

订阅专栏

博客围绕小程序获取FormId展开，指出普通方式点击一次获取一个FormId数量太少，关键在于让button样式不影响页面，这样就能一次嵌套多个button，从而实现一次获取多个FormId并提供给后端。

小程序获取到FormId给后端，一次一个太少了，如何一次多个
普通方式，点击一次就会获取一次

<form bindsubmit='submitFormId' report-submit="true">
    <button form-type="submit" class='form_button'>
            <view>
                <image src="/pages/imgs/xxx/xxx.png"></image>
            </view>
    </button>
</form>

其实关键就是如何使 button 的样式不影响页面

/*通用的button清除所有样式*/
button.form_button {
	background-color: transparent;
	padding:0;
	margin: 0;
	display: inline;
	position: static;
	border: 0;
	padding-right: 0;
	padding-left: 0;
	border-radius: 0;
	font-size:0rpx;
	color:transparent;
}
button.form_button::after {
	content:'';
	width: 0;
	height:0;
	-webkit-transform: scale(1);
	transform: scale(1);
	display:none;
	background-color: transparent;
}

然后就可以一次嵌套多个button了

<form bindsubmit='submitFormId' report-submit="true">
    <button form-type="submit" class='form_button'>
	    <form bindsubmit='submitFormId' report-submit="true">
		    <button form-type="submit" class='form_button'>
			    <form bindsubmit='submitFormId' report-submit="true">
				    <button form-type="submit" class='form_button'>
				            <view>
				                <image src="/pages/imgs/xxx/xxx.png"></image>
				            </view>
				    </button>
				</form>
		    </button>
		</form>
    </button>
</form>