是否对自定义按钮组件使用type='submit‘？
对于自定义按钮组件，是否使用type='submit'取决于你的具体需求和使用场景。
type='submit'是HTML表单中常用的属性，用于指定按钮的类型为提交按钮。当用户点击该按钮时，会触发表单的提交操作，将表单数据发送到服务器进行处理。
如果你的自定义按钮组件用于表单提交操作，比如用户填写完表单后点击按钮提交数据，那么可以使用type='submit'。这样可以保持与HTML标准的一致性，并且方便使用者理解按钮的作用。
然而，如果你的自定义按钮组件并不用于表单提交操作，而是用于其他交互或导航功能，那么就不需要使用type='submit'。你可以根据具体需求选择其他合适的type属性值，比如'button'、'reset'等，或者干脆不指定type属性。
总结起来，是否对自定义按钮组件使用type='submit'取决于按钮的功能和使用场景。在使用时，建议根据具体需求来选择合适的type属性值，以提供清晰的交互意义和良好的用户体验。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云云服务器（CVM）：提供可扩展的计算容量，支持多种操作系统，适用于各类应用场景。详情请参考：https://cloud.tencent.com/product/cvm
- 腾讯云云数据库MySQL版：提供高可用、可扩展的MySQL数据库服务，适用于各类应用场景。详情请参考：https://cloud.tencent.com/product/cdb_mysql
- 腾讯云人工智能：提供丰富的人工智能服务，包括图像识别、语音识别、自然语言处理等。详情请参考：https://cloud.tencent.com/product/ai
相关·内容
1回答
我正在使用Angular2。我把这个放在我的主组件中：
<form #f="ngForm" novalidate (ngSubmit)="save()">
<child [cosField]="cosField" [f]="f"></child>
<button type="submit" [disabled]="!f.valid">Submit</button>
</form>
我有一个与此组件不同的子组件。子组件中的
浏览 2提问于2016-09-21得票数 1
2回答
我想知道是否有一种方法来控制Bot Emulator中自适应卡中的按钮对齐。
我在模拟器和Microsoft Visualizer中尝试了相同的代码，但它们呈现的方式不同。图片如下：
下面是我使用的代码：
{
"contentType": "application/vnd.microsoft.card.adaptive",
"content": {
'$schema': 'http://adaptivecards.io/schemas/adaptive-card.j
浏览 1提问于2018-05-10得票数 0
1回答
我正在尝试创建可能具有嵌套表单的组件。我嵌套了它们，因为我希望在多个阶段进行验证，即使我只保存一次。也许我的问题有另一个解决方案，但现在我的代码看起来有点像这样：
<form (submit)="save()" #form1="ngForm">
<form (submit)="accept()" #form2="ngForm">
<!-- #form2 fields -->
<button id="submit2" type="
浏览 0提问于2019-08-21得票数 0
6回答
这应该是非常直接的。
我正在检查是否正在使用jquery提交表单。该表单有多个提交按钮，它们具有不同的值：
<button type="submit" value="foo">Foo</button>
<button type="submit" value="bar">Bar</button>
我想要找到刚刚提交表单的按钮的值：
$(form).live('submit', function() {
// Get value of submit button
浏览 5提问于2011-03-17得票数 16
回答已采纳
1回答
提交自定义角按钮组件不提交表单
、、、、
我已经将提交按钮提取到一个独立的组件中。现在，表单不再被提交/提交函数不再被调用，因为ngSubmit不会被触发。
<form [formGroup]='form' (ngSubmit)='submit(form.value)'>
...
<app-submit-button></app-submit-button>
</form>
问题是，我的自定义组件应用程序-提交按钮中的按钮会在单击时触发函数调用。提交事件不会进一步传播到父组件，因此它的提交函数不会执行。但是，当我从子组件中删除(单击)=‘sub
浏览 0提问于2019-01-02得票数 2
1回答
我有两个角度组件应用程序-图像输入和应用程序按钮。我在模板中使用app按钮进行应用程序图像输入，如下所示。
AppButtonComponent
appButton.html
<button type="button" (click)="buttonClicked.emit()">{{label}}</button>
appButton.ts
@Component({
selector: 'app-button',
templateUrl: './appButton.html'
})
export
浏览 0提问于2019-06-22得票数 6
我有一个功能组件，里面有一个按钮。我想要在单击该按钮时调用一个函数组件。
当我们单击Submit按钮时，Preview按钮就会出现，当用户单击preview按钮时，就会调用Preview功能组件。
const Form =(props)=>{
handlePreview=(e)=>{
e.preventDefault();
return <Preview/>
}
return(
<input name="email" type="text"/>
<button type="submit&
浏览 10提问于2019-07-10得票数 3
回答已采纳
我的要求是这样的。
我必须输入字段来验证用户的输入。
当用户填充字段并点击submit按钮时，在进入提交之前，我希望显示所有的错误消息。
如果用户数据中没有错误，则应提交
这是我的密码。
<template>
<div>
<h1>Add Items</h1>
Product Name :
<input
type="text"
name="product"
v-model="product"
浏览 0提问于2018-05-02得票数 8
回答已采纳
我正在尝试构建一个页面，用户可以添加/删除多个小表单，每个表单将请求发送到不同的API。是否可以使用一个按钮来触发每个表单的所有onSubmit事件？
<form id="form1">
<input name="field1" type="text" />
</form>
<form id="form2">
<input name="field2" type="text" />
</form>
<form
浏览 0提问于2021-09-09得票数 0
1回答
我对使用Vue2非常陌生。我使用的是Vue CLI，所以我只是遵循从它生成的结构。
我想做的是提交表格数据。但我一直收到警告和错误：
Vue警告:属性或方法"onSubmit“不是在实例上定义的，而是在呈现期间引用的。通过初始化属性，确保此属性在“数据”选项中或在基于类的组件中是反应性的。
和
Uncaught：_vm.onSubmit不是函数
下面是我的.vue文件中的相关代码：
<script>
import { contact } from './my/exports';
export default {
name: 'C
浏览 0提问于2018-02-26得票数 2
我有一个简单的表单来执行每个字段的验证。由于某些原因，我认为与CodenameOne主题相关的是，我没有获得失败验证字段的红色大纲或背景，也没有看到错误消息。该表单将灰色的“提交”按钮，直到所有的验证通过，因此这一部分是有效的。我只是看不见屏幕上的错误。我已经在下面列出了我的表单代码。这是因为我使用的默认主题没有显示错误样式所需的UUID吗？
在应用样式但在主题中不可用时，是否存在调试方法？
Form registrationForm = new Form("My Registration");
BorderLayout bl = new BorderLayout
浏览 1提问于2016-08-23得票数 2
回答已采纳
2回答
角反应嵌套形式
、、、、
我试图在我的角度项目中嵌套多个反应形式，并且有不同的组成部分。
例如，我有一个包含两个输入的表单，一个输入为名称，一个输入用于描述和一个提交按钮。我称这个组件为NameDescComponent
我计划在多个页面和表单中使用这个组件。以下是该组件的html。
<form [formGroup]="nameDescForm" (ngSubmit)="customEmit()">
<div fxLayout="row" fxLayoutGap="10px" fxFlex>
<mat-f
浏览 0提问于2019-01-09得票数 3
回答已采纳
1回答
我有一个表格，上面有多个输入。单选按钮显示为“提交”按钮。
当按下提交按钮时，我想在最后发送表单。
代码示例：
{
"blocks": [
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "Section block with radio buttons"
},
"access
浏览 2提问于2021-10-19得票数 1
我有一个带static_select的松弛模式
{
block_id: "my_block_id",
type: "section",
text: {
type: "mrkdwn",
text: "Please select one"
},
accessory: {
type: "static_select",
action_id: "select_type",
浏览 0提问于2019-11-28得票数 2
Store.js：
import {useReducer} from "react";
import {ACTION_TYPES} from "./storeActionTypes";
export const INITIAL_STATE = {
counter: 0,
};
export const storeReducer = (state, action) => {
switch (action.type) {
case ACTION_TYPES.INCREASE_COUNTER_BY_1:
return {
浏览 8提问于2022-10-30得票数 0
回答已采纳
我有一个带有登录表单的组件。
我需要做的是让它在用户单击submit按钮后重新加载页面/路由。
原因是在单击submit按钮之后，需要对nav组件进行一些更改，而不是这个组件。
您可以看到，我使用了sessionStorage.setItem('something'，'somevalue');，然后nav组件读取并进行了一些更改。
现在，为了查看更改，我需要重新加载浏览器。
以下是代码：
class Login extends Component {
constructor(props) {
super(props);
this.state
浏览 1提问于2017-06-29得票数 2
回答已采纳
我有一个数组，它包含一些复选框id号，当用户单击表中的某些复选框时会添加这些数字。如果数组是空的，我想禁用一个按钮，并在它有一些项时启用它。
var ids = [];
$('#Table tbody').on('click', '.checkbox', function () {
var idx = $.inArray($(this).attr("id"), ids);
if (idx == -1) {
ids.p
浏览 1提问于2018-07-30得票数 1
回答已采纳
<input type="text" data-bind="value:Firstname" />
<i class="fa fa-exclamation-circle"></i>
<i class="fa fa-check-circle"></i>
<input type="text" data-bind="value:Lastname" />
<i class="fa fa-exclamation-circle
浏览 4提问于2016-04-04得票数 0
回答已采纳
我使用的是材料UI版本4(最新版本)和。我有一个自定义组件(自定义与知情集成)，它包装了使用Autocomplete组件呈现的Material。
应用程序组件
<Form getApi={(api) => setFormApi(api)}>
{formApi && (
<>
<label>
First name:
<Autocomplete
freeSolo
options
浏览 2提问于2020-11-02得票数 0
回答已采纳
我有一个输入框和一个按钮，定义如下：
<form class="form-inline">
<input type="text" title= "language" class="input-block-level" placeholder="Insert Languages"/>
<button type="submit" class="btn btn-primary">Filter by Language
浏览 0提问于2013-07-19得票数 1
回答已采纳
是否有办法通过单击Vue单元测试中的submit按钮来实际触发表单的提交？
让我们以这个简单的组件为例：
<template>
<form @submit.prevent="$emit('submitEventTriggered')">
<button type="submit">Submit Form</button>
</form>
</template>
<script>
export default {}
<
浏览 0提问于2018-11-19得票数 15
回答已采纳
我正在尝试使用bootstrap在搜索栏中添加按钮，，但它似乎不起作用。它显示在educomer.herokuapp.com上，我使用的代码是
%form.form-search
.input-append
%input.span3.search-query{:placeholder => "Search Food", :type => "text"}
%button.btn{:type => "submit"}
%s
浏览 1提问于2012-10-16得票数 0
回答已采纳
2回答
是否有一种方法可以让用户在页面中填写表单，然后在submit上连续填充表格，直接在submit按钮下面填充。
还必须保存/存储此信息，以便当用户返回时，前面的帖子就在那里。
我不确定我是否知道如何做被解释的事情。
这是我的表格，很好用
<form id="myForm" action="" method="post" target="_parent">
<p>Date:
<input type="date" cf_name="Date" value="
浏览 0提问于2017-11-04得票数 0
3回答
我使用的是基于的和。
我试图调用2个不同的函数，形成2个php文件，使用1个表单和2个提交按钮。
我将我制作的组件Edit.php和Delete.php连接到一个页面上。
我没有将表单操作定向到/Edit.php，而是将其定向到当前url，并使用处理程序在Edit.php中调用php函数onEdit()，使用Edit按钮。
在相同的表单中，如何使用Delete按钮在Delete.php中调用Delete.php？
它只选择一个处理程序并调用它的函数。
我不能将这两个函数合并到1 php文件中。
表格
<!-- Edit or Delete -->
<form me
浏览 7提问于2017-03-07得票数 1
回答已采纳
2回答
我的子组件中有一个表单： <form @submit="submitForm">
<input type="text" v-model="textInput" />
</form>
export default {
name: "childComp",
data: function() {
return {
textInput: ""
}
}
} 现在，我的父组件中有一个按钮，我需要单击该按钮来获取子表单数据。 <button
浏览 22提问于2019-12-11得票数 3
如何使用外部css文件(这是代码)来设置提交按钮的样式
<div class="bu">
<form action="#">
<button type="submit" class="but" value="submit">Log in</button>
</form>
</div>
浏览 4提问于2022-07-22得票数 0
回答已采纳
我有两个组件： 父组件HTML： <parent-component>
<child-component [input]="inputValue"> </child-component>
<child-component [input]="inputValue"> </child-component>
<button mat-stroked-button> Submit </button>
</parent-component> 父组件TS
浏览 31提问于2019-05-09得票数 1
<button onclick="createForm">create form</button>
<form >
<label for="fname">First name:</label><br>
<input type="text" id="fname" name="fname" value="John"><br>
<label for="lname">Las
浏览 0提问于2021-06-02得票数 0
回答已采纳
1回答
Vue组件事件处理
、、、
我有一个组件按钮，我在我的网站上几乎所有地方都使用这个按钮。
这是一个带有悬停动画的SVG按钮。按钮工作正常。
<template>
<a class="button"
@mouseover="buttonEnter"
@mouseout="buttonLeave">
<svg viewBox="0 0 180 60">
<path ref="btnPath" d="..." />
</svg>
<s
浏览 32提问于2019-03-21得票数 0
回答已采纳
我在控制器指令里接到了这个电话
ngDialog.openConfirm({
template : '<form-directive></form-directive>',
plain : true,
closeByNavigation : true,
scope : $scope
})
.then(function( response ) {
$log('SENDED
浏览 0提问于2016-06-06得票数 2
1回答
用酶测试按钮类
、、、
我有以下按钮：
import React from 'react';
import PropTypes from 'prop-types';
const Button = ({
text, url, state, type,
}) => (type === 'link' ?
<a className="abs3-link" href={url}>{text}</a> :
<button className={`abs3-button abs3-button--${state}`}
浏览 0提问于2018-06-15得票数 2
回答已采纳
2回答
我是一个新的反应测试库，我已经尝试测试一个函数很长一段时间了。例如，我想检查当一个按钮被点击时，是否调用了一个给定的函数并抛出了错误。因此，任何帮助都将非常感谢，如果可能的话，请与我分享任何有用的资源。
signin.js
export default class SignIn extends Component {
constructor(props) {
super(props);
this.state = {
};
}
handleClose = (event, reason) => { };
val
浏览 0提问于2020-03-29得票数 1
2回答
目前，我正在尝试传递一个ref，以便在submit上获取输入(基本输入组件)的值。您将在下面找到这两个组件。使用console.log在handleSubmit中，电子邮件总是未定义的。
提前谢谢你的帮助。
父组件
<template>
<form @submit.prevent="handleSubmit">
<div class="flex flex-col mt-10">
<form-label forInput="email" label="Email Addres
浏览 8提问于2022-10-27得票数 0
回答已采纳
1回答
角自完全下垂
、、、、
我想要创建一个自动完成的输入字段。因此，当我在输入字段中写入时，它会将我显示为数据库中的下拉值。理想情况下，它应该是有棱角的材料，但我不能正确地工作。因为我需要这样的东西：(我写的字母应该有不同的颜色)
现在，我做了这件事：
当我刷新页面时，默认情况下它会显示。所以我的自动完成系统不工作了。
HTML
<form class="mt-4 mb-4">
<mdb-form-control class="d-flex align-items-center">
<
浏览 2提问于2022-01-20得票数 0
我有一些类似以下的东西： HTML模板： <form [action]='endpoint' method="post" target="my_iframe" #confirmForm (ngSubmit)="submitConfirmation()">
<button type="submit" (click)="confirmForm.submit()">Submit</button>
</form>
<iframe name=
浏览 11提问于2020-04-07得票数 0
2回答
按照正常的路由过程，通过制作不同的组件，单击Submit按钮后，下一个组件的内容将显示在按钮本身下面(如submit按钮下面所示)。
但是，在单击Submit按钮后，我想转到一个完全不同的页面，如下面的图像。
单击左侧页面上的Submit按钮，我想转到一个新页面，该页面将显示Hello成员。
下面是我正在做的事情，因此子组件的内容(例如，Hello成员)将被追加到下面。
<button mat-raised-button color="primary" id="button" type="submit" routerLi
浏览 0提问于2018-01-11得票数 0
回答已采纳
我有一个有3个按钮的面板，我想点击每个按钮，一个不同的组件会出现在同一个地方。怎样才能做到这个逻辑呢？
<AddNotification />
<EditNotification />
<DeleteNotification />
const AdminPanel = () => {
return (
<Card className={classes.input}>
<div><h1>Notification Panel</h1></div>
浏览 9提问于2022-04-14得票数 0
回答已采纳
当我打电话时，我无法确定是什么原因导致我的表单不能提交
$('#form').submit();
通过javascript提交(但当我单击submit按钮时提交得很好)。所以我添加了这段用于测试的代码：
$('#form').live('submit', function()
{
alert('submitting form');
return true;
});
现在，当我单击submit按钮时，将显示警报，然后提交表单。当我调用时：
$('#form').submit();
通过javascri
浏览 0提问于2010-07-09得票数 0
回答已采纳
6回答
我想要创建一个带有角2的大表单，但是我想用多个组件创建这个表单，如下例所示。
应用程序组件
<form novalidate #form1="ngForm" [formGroup]="myForm">
<div>
<address></address>
</div>
<div>
<input type="text" ngModel required/>
</div>
<input type="submit" [d
浏览 5提问于2017-04-07得票数 79
回答已采纳
4回答
我想在我的子组件Html页面中显示taxDetailsId。但是当单击submit按钮时。单击submit按钮后，在我的子组件Html页面中显示taxDetailsId。父组件
export class OnlinePaymentComponent implements OnInit {
HttpClient: any;
paymentForm: FormGroup = this.formBuilder.group({
taxDetailsId: ['', [Validators.required]]
});
浏览 5提问于2021-08-15得票数 2
我有一个带有onSubmit函数和"Submit“输入的ReactJS表单，如下所示。 <Form id="addItem" method="post"
onSubmit={this.handleSubmit}>
<Form.Group>
<Form.Row>
<Col xs={6}>
.
.
.
</Form.Group>
<Form.Control type="submit" id="addItemSubmit" n
浏览 44提问于2021-05-10得票数 1
回答已采纳
我在一个组件(Component1)中加载另一个包含表单的独立组件(Component2)。
假设您已经创建了一个表单组件，我希望将其集成到我的组件中，并触发您编写的提交函数，而无需单击您的提交按钮。
此表单上的提交按钮将触发一个保存数据的函数：
submitData(newUserForm: NgForm)
主组件(Component1)也有一个submit按钮。我想要的是从Component2中删除submit按钮，并在单击submit from Component1时触发submit函数。
类似于：
<button type="button" class="
浏览 24提问于2021-05-03得票数 0
我使用javascript从客户端获取一个值，使用的按钮没有绑定到wicket组件(也就是说，它没有wicket-id)。现在，我需要将该值设置为一个文本字段(textarea) -这是一个wicket组件，但无法这样做。如果我在一个简单的文本区域(而不是wicket组件)中设置值，那么它工作得很好。但我需要在wicket组件中使用该值，以便在表单提交时获得它的值。
Javascript在wicket组件上不起作用。
Javascript方法：
var text2 = document.getElementById("e2");
var text1 = document.get
浏览 4提问于2018-02-13得票数 3
回答已采纳
我创建了这个示例，下面是代码：
import React, { ReactNode, useState } from "react";
import { Formik, FormikConfig, FormikProps, Form, FormikErrors } from "formik";
import { useEffect } from "react";
import { scrollToValidationError } from "./scrollToValidationError";
// const isEmpt
浏览 1提问于2020-04-07得票数 1
回答已采纳
当我单击Submit按钮时，它应该将我重定向到另一个页面，在那里，我的其他所有页面都应该显示在那里。这是提交页面，在这里我编写了一个函数来重定向到主页。
import React, {Component} from 'react';
import './App.css';
import { BrowserRouter, Route, Link } from 'react-router-dom';
import Home from './components/home';
class App extends Component {
浏览 0提问于2019-09-04得票数 2
回答已采纳
3回答
我有一个简单的表单，几乎没有不同的输入类型。基本上，我检查text、textarea、datetime-local是否有一些值，以及是否选中了所有单选按钮。这就是我正在使用的代码
$("#submit_button").click(function() {
var alarm = 0;
$('input[type="text"]').each(function() {
if ($(this).val() == "") alarm = 1;
})
$('textarea').eac
浏览 0提问于2017-07-27得票数 0
我正在尝试创建一个登录页面，并具有以下内容：
<div id="loginField">
<input id="username" type="text" name="user" required></input>
<input id="password" type="password" name="password" required></input>
<input id="sub
浏览 2提问于2017-03-07得票数 0
从下拉日历中选择日期并设置该值自动提交的时间之后。但是，我希望使用submit按钮来提交值。从研究中我认为，'event.preventDefault();'，语句应该可以防止这种事情发生。另外，该值是否存储在inputValue中？如果是，如何从日历类外部访问该值？
因此，为了清楚起见，我想使用submit按钮提交值。
class Calendar extends React.Component {
constructor(props) {
super(props);
this.state = {
浏览 3提问于2018-07-29得票数 2
回答已采纳
3回答
我希望在打开表单时选中"Exact“单选按钮： <Form
onSubmit={onSubmit}
initialValues={{ match_type: "exact" }}
render={({ handleSubmit, form, reset, submitting, pristine, values }) => (
<form
onSubmit={() => {
handleSubmit();
}}
&
浏览 44提问于2020-08-18得票数 1
嗨，我正在做我的项目中的一个React项目，一个按钮来了很多次。因此，我为button创建了一个组件，并且在我获得按钮的任何地方重用该组件。现在的问题是，当我尝试将onClick函数应用于该按钮组件时，我的函数不工作，因此请帮助我解决此问题。 这是按钮组件Button.js import React from "react";
import "./Button.css";
const Button = () => {
return (
<div>
<button className="btn btn-p
浏览 28提问于2021-07-12得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
