ドラッグ可能な要素をフォームに追加するスクリプトがあります。
これは、別のスクリプトとそのスクリプトを追加するまでは非常にうまく機能し、その後、前のオンが応答を停止します。どちらのスクリプトも DOM に存在します。
1回目はなんでやめたの?
私が試してみました
$.noConflict()
と
jQuery.noConflict()
しかし、これは完全に機能しなくなります。
ドラッグ可能な要素を追加するスクリプトを以下に示します。
function createTextBox() {
//Random name for out text box. users dont see this.
var textBoxName = 'tb_' + Math.floor(Math.random() * 10000)
var html_script;
html_script="<div id='draggable" + textBoxName + "' style='position: absolute; top: 100px; left: 100px;'>" +
"<img src='../../Images/next.png' style='cursor: pointer;'/><img style='cursor: pointer;' src='../../Images/delete.png' onclick=\"RemoveTextBox('" + textBoxName + "')\"/>" +
"<a href='#' class='data_field ui-draggable ui-resizable' id='draggable" + textBoxName + "'></a>" +
"<textarea rows='5' cols='80' title='Text Box' data-tooltip='Tool'" +
" data-width='100'" +
" data-height='20'" +
" data-topx='10'" +
" data-topy='10" +
" data-multiline='true'" +
" data-hidden='false'" +
" data-type='textBox'" +
" name='" + textBoxName + "'" +
" id='" + textBoxName + "'" +
" class='data_field ui-widget-content ui-corner-all'" +
" style='background-color: transparent; width: 100px; height: 20px;'>Text Box</textarea> " +
"</div>"
document.getElementById('text_boxes').innerHTML += html_script;
var java_script = "$(function () {" +
" var sh = 0;" +
" var sw = 0;" +
" $('#draggable" + textBoxName + "').draggable({" +
" drag: function (event, ui) {" +
" dragposition = ui.position;" +
" $('#" + textBoxName + "').attr('data-topx', dragposition.left);" +
" $('#" + textBoxName + "').attr('data-topy', dragposition.top);" +
" }" +
" });" +
" $('#" + textBoxName + "').resizable({" +
" stop: function (event, ui) {" +
" s = ui.size;" +
" sh = s.height;" +
" sw = s.width;" +
" $('#" + textBoxName + "').attr('data-width', s.width);" +
" $('#" + textBoxName + "').attr('data-height', s.height);" +
" }" +
" });" +
"});"
var script = document.createElement('script');
script.type = 'text/javascript';
script.text = java_script;
document.getElementById("text_boxes").appendChild(script);
};
誰かが悪いコードだと思っているのに、ほんの数か月しか使っていないのなら、本当に申し訳ありません!
したがって、ユーザーがアイコンをクリックするたびに、ドラッグ可能なボックスが生成されます。その後、ユーザーが別のボックスを生成すると、両方とも移動可能のままになります。
各ボックスのスクリプトを生成せずにそれを行うより良い方法があると確信していますが、まだ知りません!
ありがとう
ありがとう