jqueryによってダイアログボックスを作成し、その中の文章にクリック回数のカウント数を入れたいのですが、html内にダイアログボックスとしたい文章を用意すると、初期値を取得してしまいます。どのような解決法がありますでしょうか、ご教授いただければ幸いです。
(funcadd1()は#sampleをparseIntして1を足す関数です)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
<script type="text/javascript">$(function () {
$('#dialogdemo1').dialog({
autoOpen: false,
title: 'Confirmation',
closeOnEscape: false,
modal: true,
buttons: {
"OK": function () {
$(this).dialog('close');
}
}
});
});
</script>
<link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript">
function funcAdd1() {
document.getElementById("sample").innerHTML =
parseInt(document.getElementById("sample").firstChild.nodeValue) + 1;
}
</script>
<script type="text/javascript">
Dialog()
function Dialog() {
$('.kb').click(function () {
$('#dialogdemo1').dialog('open');
});
}
</script>
<div class="every">
<div class="buttons">
<div class="fav">
<div id="sample">1</div>
<div id="favorite">
<button onclick="return funcAdd1()" class="fb">カウント増</button>
</div>
<div class="kb">
<button type="button" class="kakunin" onclick="Dialog()">確認</button>
</div>
</div>
</div>
</div>
<div id="dialogdemo1">
<p>選択</p>
<form id="method">
<select name="Owen">
<option value="0">1</option>
<option value="1">2</option>
<option value="2">3</option>
<option value="3">4</option>
</select>
</form>
<script type="text/javascript">
var count = parseFloat(document.getElementById("sample").innerHTML);
document.write(count);
</script>
</div>