здесь, у меня есть код, который позволяет перетаскивать гармонию. Но то, что я хочу, - это когда пользователь нажимает на редактирование, тогда контент в гармонике должен быть доступен для редактирования. Я пробовал ответы по следующей ссылке How to make an element's content editable with JavaScript (or jQuery). Но не получить результат, который я хочу.contenteditable не работает в согласии
Сценарий:
<head>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src=" http://code.jquery.com/jquery-2.0.2.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(document).ready(function() {
$('#accordion').accordion({
collapsible: true,
active: false,
height: 'fill',
header: 'h3'
}).sortable({
items: '.s_panel'
});
$('#accordion').on('accordionactivate', function (event, ui) {
if (ui.newPanel.length) {
$('#accordion').sortable('disable');
} else {
$('#accordion').sortable('enable');
}
});
$(".sortable").sortable({
connectWith : ".sortable"
});
});
</script>
<script>
$('#btn1').click(function() {
$('#content1').attr('contenteditable', 'true');
});
</script>
</head>
HTML, является:
<body>
<br /><br />
<div id="source" style="width:345px;float:left; border:1px dotted ">
<div id="accordion" style="height:450px;width:300px; " class="sortable">
<div class="s_panel">
<h3 class="ui-state-default unassigned">About Us</h3>
<div id="data">
<div id="content1">This is about Us</div>
<form>
<input id="bt1" type="button" value="edit"/>
</form>
</div>
</div>
</div>
</div>
<div id="teams" style=" position:absolute; top: 100px; left:400px; width:600px;" >
<ul class="sortable" style="height:450px;width:550px; "></ul>
</div>
</body>
Как просто создать скрипку http://jsfiddle.net/ – Anup
@Anup ... что это было? пустая скрипка? – Rumin
Я предлагал вам создать скрипку. – Anup