12

HTMLフォームのテキストフィールド内にdivを配置するにはどうすればよいですか

<h2>Skills</h2>
<label for="skills">Choose your skills</label>
<input id="skills" type="text"/>

私の英語が上手ではないことに注意してください。だから私はあなたにこれ以上話すことはできません。

各divの各スキルをレンダリングしたいだけです。

私のjqueryコード（カンマ区切り）は次のとおりです。

$("input#skills").keydown(function(e){
   if(e.which===188){
      var skbl = $.trim($("input#skills").val());
      $("input#skills").append("<div style='background:green;'>"+skbl+"</div>");
});
4

4 に答える 4

5

これを行う方法は、入力と必要な div をラッパー div 内に配置することです。これは、入力のように見える必要があります-必要な幅、入力の長さ、および境界線が必要です。内側の入力は、境界線なしで幅が小さいインラインブロックである必要があり、内側の div は、外側の div の残りの幅を埋める、境界線なしで幅のあるインラインブロックである必要があります。このようにして、入力に画像を作成できます。画像は、入力内の div またはクリック可能なボタンにあります。

ここを参照してください： 入力フィールド内のクリック可能なアイコン

于 2014-12-10T07:54:13.710 に答える
3

またはdivなどのテキスト フィールド内に を追加する場合は、次のようにします。inputtextarea

$("input#skills").val("<div style='background:green;'>"+skbl+"</div>");

これにより、フィールド全体が更新されます。これを試すことができます：

$("input#skills").append(new_val);

ノート：

HTMLで値を使用できますinput。ただし、他のサーバー側の問題が発生します。そういうわけで、コランダスはあなたにそこに書かないように頼んでいたと思いますが、彼の考えは良いことです. 編集方法がわからず、ブラウザが UI を台無しにしてしまうからです。

于 2013-10-08T00:01:19.137 に答える