相关疑难解决方法(0)

HTML按钮不提交表单

我有一张表格.在那个表格之外,我有一个按钮.一个简单的按钮,如下所示:

<button>My Button</button>
Run Code Online (Sandbox Code Playgroud)

然而,当我点击它时,它会提交表单.这是代码:

<form id="myform">
    <input />
</form>
<button>My Button</button>
Run Code Online (Sandbox Code Playgroud)

所有这个按钮应该是一些JavaScript.但即使它看起来像上面的代码,它提交表单.当我将标签按钮更改为span时,它可以完美地工作.但不幸的是,它需要成为一个按钮.有没有办法阻止该按钮提交表单?比如说

<button onclick="document.getElementById('myform').doNotSubmit();">My Button</button>
Run Code Online (Sandbox Code Playgroud)

html javascript

345
推荐指数
5
解决办法
17万
查看次数

Angular 2:如何阻止表单在按键输入时提交?

我有一个表单,其中一个字段充当自动完成.如果用户输入单词并按Enter键,则该字段的内容应添加到该字段下方的列表中.

问题:当用户点击进入时,自然会提交整个表单.

我已经return false处理了处理按键的功能.但是,即使在调用此函数之前,表单似乎也已提交.

我该如何防止这种情况发生?

基本形式:

<div id="profileForm">
  <form [formGroup]="profileForm" (ngSubmit)="onSubmit()" method="post" *ngIf="!showSuccessMessage">

    <div class="row">

      <div class="form-group col-xs-12 col-sm-6">
        <label for="first_name">My Skills</label>
        <div class="autocomplete">
          <input formControlName="skill_string" [(ngModel)]="skillString" name="skill_string"
          type="text" class="form-control" id="skill_string" placeholder="Comma separated" (keyup.enter)="skillsHandleEnter(skillString)">
          <ul class="autocomplete-list" *ngIf="skillHints.length > 0">
            <li class="list-item" *ngFor="let skill of skillHints" (click)="addSkillFromAutocomplete(skill)">{{skill}}</li>
          </ul>
        </div>
        <div id="skill-cloud" class="tag-cloud">
          <span class="skill-tag tag label label-success" *ngFor="let skill of selectedSkills" (click)="removeSkill(skill)">{{skill}} x</span>
        </div>
      </div>

    </div>

    <div class="row">

      <hr>

      <div class="form-group submit-group">
        <div class="col-sm-12">
          <button type="submit" class="btn btn-primary pull-right" …
Run Code Online (Sandbox Code Playgroud)

javascript angular

12
推荐指数
2
解决办法
1万
查看次数

标签 统计

javascript ×2

angular ×1

html ×1