5

プラグインを使用しjquery ui draggableて、HTML テキスト ボックスを次のようにドラッグ可能にしました。

<script type="text/javascript" language="javascript">
    $(document).ready(function() {
        $("#Text1").draggable({
            containment: "parent",
            cancel: null
        });
    });
</script>

<form id="form1" runat="server">
<div>

    <div id="dialog" title="Dialog Box" style="border: solid 1px black;">
        <input id="Text1" type="text" style="width: 200px; height: 20px;" value="Text1" />
    </div>

</div>
</form>

しかし、jQuery を使用してサイズ変更可能にする方法は?

前もって感謝します。

ゴラン

4

2 に答える 2

5

HTMLテキストボックスを作成して使用するデモは次のとおりですresizabledraggablejquery-ui

HTML:

<div id="container" class="ui-widget-content">
<h3 class="ui-widget-header">Containment</h3>
<span id="draggable">*  
<input type="text "id="resizable" class="ui-state-active" value="This is input box">
</span>
</div>

JS:

$(function() {
     $( "#resizable" ).resizable({
containment: "#container"
});
     $( "#draggable" ).draggable({containment: "#container"});
});
于 2014-07-11T07:32:26.343 に答える
2

を使用してjQuery UI
HTML ファイル
<input type="text" id="resizable" />
JavaScript ファイル は、script タグで必要なすべての jQuery ファイルを参照します。

<script src="*all needed .js files*"></script>

<script>
    $(function() {      
    $( "#resizable" ).resizable();
});
</script>

ところで、なぜテキストボックスをサイズ変更可能にする必要があるのですか

于 2012-05-24T07:36:25.930 に答える