Internet Explorer 中的 html 输入按钮不会出现新行答案

【问题标题】：New Line doesn't ocured for html input button in Internet ExplorerInternet Explorer 中的 html 输入按钮不会出现新行
【发布时间】：2014-10-14 08:15:45
【问题描述】：

我有一个 Html 输入按钮：

  <input id="Meal17" runat="server" type="button" style="height: 60px; width: 235px; display: block;" class="arrayinput" />

现在我想用 JQuery 为它设置值：

  $("#Meal17").click(function (e) {
  $(this).val("hello" + "\n" + "this is test" );
}

现在在 INTERNET Explorer 中，我的按钮值中的新行没有出现，为什么？我该如何解决它。非常感谢。

【问题讨论】：

@nevermind：IE11 不行！
是的，对不起，我的错误....删除评论....
@Farna 为此使用<div> 怎么样？ Fiddle example.
@Fiddle 例子：非常感谢，我改成
，成功了。

标签： jquery css newline

【解决方案1】：

改用button 元素并在其中使用<br> 换行：

<button id="Meal17" runat="server" type="button"
style="height: 60px; width: 235px; display: block;"
class="arrayinput">Hello<br>this is test</button>

或者，在你的情况下使用 jQuery，

$("#Meal17").click(function (e) {
  $(this).html("hello<br>this is test" );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="Meal17" runat="server" type="button"
  style="height: 60px; width: 235px; display: block;" class="arrayinput">Dummy</button>

【讨论】：

【解决方案2】：

这是 Internet Explorer 中的 known problem。作为一种解决方法，插入 <br> 元素而不是换行符。

【讨论】：

标记在value 属性/属性中被忽略。