Question

在input内，我希望type=submit width 150px具有固定的<form>，比如>，其中提交此--------------------------------- | Let's go > | ---------------------------------。在这个按钮中，我希望在最左侧有一个文本，在最右侧有一个input符号，如下所示：

div

最初我通过将:after括在>然后在CSS中，使用float:right伪选择器添加input符号（并给它一个form之后的div}。 但问题是，如果用户点击input span文字以外的任何地方，则>未提交。

我真的希望有两个p s（一个用于文本，一个用于input）或两个input，但是必须提交表单，因此{必须使用{1}}，并且span内不能包含p或double v1 = (double)51/4;等。

我该怎么办？

Answer 1

您可以使用<button type="submit></button>并将其设为width: 100%：

.btn-wide {
  width: 100%;
  text-align: left;
  padding: 10px;
  font-size: 20px;
}
.btn-wide .icon {
  float: right;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

<br><br><br>

<button type="submit" class="btn btn-wide">
  <span class="label">Save</span>
  <i class="icon fa fa-angle-right"></i>
</button>

Answer 2

将此添加到您的div

<div id="submit" onclick="submitForm()">

的Javascript

function submitForm()
 {
      document.getElementById('YourFormId').submit();
 }

Answer 3

喜欢这个

#target:after{
  content:'>'
}

<button id='target' type='submit'>
Let's Go&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
</button>

由于你想要固定宽度，这是另一个涉及填充的解决方案

#target:after{
  content:'>'
}
#target span{
  padding-right:300px;
}

<button id='target' type='submit'>
<span>Let's Go</span>
</button>

我可以在不使用<input />元素的情况下提交表单，还是<input />元素可以包含两个<p>元素？

3 个答案: