javascript - Jquery 从 div 部分追加文本

Question

我正在尝试使用 jquery 将文本添加到 div sectionj 但文本超出了我想要的 div.. 我的 html 看起来像:

<!--CONTENT AREA-->
<div id="content">
  <div id="content_inner">
    <h2 id='titulo'>BUSCAR:</h2>
    KEYWORDS: 
    <input type='text' id='paramsQuery'>
    <input type='submit' id='botonBuscar' value='buscar'>
    <div id='results'></div>
  </div>
</div>  

我的 js 函数如下所示:

$(document).ready(function() {
  $("#botonBuscar").click(function() {
    var params = $("#paramsQuery").val();
    $("#column3_inner").append(params); 
  });
});

有什么建议可以使文本保持在所需的宽度上吗？

Answer 1

您要将结果添加到不在提供的代码中的元素。也许你打算把它放在 #results 中？

$(function() {
  $("#botonBuscar").on("click", function() {
    $("#results").append( $("#paramsQuery").val() ); 
  });
});

演示:http://jsbin.com/icapuh/edit#javascript,html

如果您的文本溢出了您的框，您可以在那里有几个选项。你可以打破这些线:

#results {
  word-wrap: break-word;
}

或者你可以导致滚动:

#results {
  overflow-x: scroll;
}

或者设置text-overflow来显示省略号:

#results {
  overflow: hidden;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  -ms-text-overflow: ellipsis;
}