мне очень нужна ваша помощь,Невозможно захватить удаления нажатия в JQuery Диалог
Я пытаюсь захватить удаления нажатия клавиши в #refdocs_list UL, но по какой-то странной причине, когда я попал удалить ключ, ничего происходит, и я не получаю никакого сообщения.
Я в затруднении для решений.
Вот Разметка в вопрос:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery-ui.js"></script>
<link rel="stylesheet" href="jquery-ui.css" type="text/css"/>
<style type="text/css">
.refdoc_selected {
background-color: rgb(10,36,106);
color: #FFF;
}
</style>
<script type="text/javascript">
function showDialog() {
var refdocs = [12256363,96415678,96857456,12236748]
var markup ='<div style="margin-bottom: 2px;">' +
'<p style="margin: 0; padding:0;">' +
'<input style="margin-top: 1px; margin-right: 2px" float: left;" id="refdocs_input" type="text" class="field_outline inputbox">'+
'<button id="btn_add_refdoc" class="button" style="margin-right: 2px;"><img style="width: 14px;" src="images/icon_check.png"></button>'+
'<button id="btn_del_refdoc" class="button" style="margin-right: 2px;"><img src="images/icon_delete.png"></button>'+
'<button id="btn_empty_refdocs" class="button" style="margin-right: 2px;"><img src="images/icon_trash.png"></button>'+
'</p>'+
'</div>'+
'<div class="field_outline" style="background: #FFF; min-height: 75px; max-height: 300px; overflow-y: auto;">'+
'<ul id="refdocs_list" style="list-style-type: none; margin: 0; padding: 3px 0px 3px 3px;"></ul>'+
'</div>'
$("<div></div>").dialog({
modal: false,
title: "Reference Documents",
width: 350,
open: function() {
$(this).html(markup)
for (var i = 0; i < refdocs.length; i++){
$("#refdocs_list").append('<li style="background-image: url(images/icon_doc.png); background-repeat: no-repeat; background-position: 0 50%; padding: 4px 0 2px 16px;">'+ refdocs[i] +'</li>')
}
$("#refdocs_list li").click(function() {
$(this).addClass("refdoc_selected").siblings().removeClass("refdoc_selected")
document.getElementById('refdocs_input').value = $(this).text()
});
//NOT WORKING:
$('#refdocs_list ul').keyup(function(e){
if(e.keyCode == 46) {
alert('Delete Key Pressed');
}
});
},
close: function(){
$(this).remove();
},
buttons: [
{
text: "CLOSE",
"class": 'button',
click: function() {
$(this).dialog("close")
}
},
{
text: "CANCEL",
"class": 'button',
click: function() {
$(this).dialog("close")
}
}
]
});//end dialog
}
</script>
</head>
<body>
<input type="button" onclick="showDialog()" value="test">
</body>
</html>