Jquery 根据成功调用操作输入字段

我有以下代码：

<div id="email-forgot-div">
    <input data-placement="bottom" type="text" class="form-control form-control-email" id="Forgot-Email" name="Forgot-Email">
    <button type="submit" class="btn btn-success" id="reg-forgot-submit">Submit</button>
    <div id="ajaxNotify"></div>
</div>

提交

因此，在我的成功呼叫之后，我尝试在

忘记电子邮件后添加字段，我还想将两个字段的大小调整为大小的一半，现在大小是一个字段是完整大小，并且在线上有一个提交
按钮

现在我想在同一行上显示两个字段并提交
按钮。如何做到这一点？
您可以添加“浮动类别”，例如：

<input style="float:left;" /><button style="float:right;"></button>



这是我能想到的唯一方法，如果有其他可用的方法的话。试试那些吧。我使用浮动将我的徽标与标题上同一行的标题文字分开。您是否也考虑过“液体”（百分比宽度）的CSS，看看这是否有帮助？另外，查看maxlength（允许字符的长度）大小控制在键入更多字符之前可见的字符数。然而，我不相信maxlength适用于按钮，但无论如何，请尝试一下

<input size="30" maxlength="100" /><button size="15"></button>



希望这能奏效
 在大多数情况下，在页面上有额外的输入，并在提交表单时显示/隐藏它会更容易。我做了一个简单的plunk-当单击submit按钮时，它会将一个类添加到#email Forget div。这个附加类显示额外的输入并更改表单元素的宽度

修改后的html为：

<div id="email-forgot-div">
  <input data-placement="bottom" type="text" class="form-control form-control-email" id="Forgot-Email" name="Forgot-Email" />
  <input class="form-control extra" name="extra"/> 
  <button type="submit" class="btn btn-success" id="reg-forgot-submit">Submit</button>
  <div id="ajaxNotify"></div>
</div>

相关的css是：

#email-forgot-div input, #email-forgot-div button {
  float: left;
  width: 50%;
}

.extra {
  display: none;
}

#email-forgot-div.extra-input input, #email-forgot-div.extra-input button {
  display: block;
  width: 33.333%;
}

由于潜在的链接损坏，通常不建议使用仅链接的答案。您能否更新您的答案以提供一个小的代码示例？
#email-forgot-div input, #email-forgot-div button {
  float: left;
  width: 50%;
}

.extra {
  display: none;
}

#email-forgot-div.extra-input input, #email-forgot-div.extra-input button {
  display: block;
  width: 33.333%;
}