JavaScript事件未在引導模式中的元素上觸發

-1

我有一個使用虛擬鍵盤將數據輸入到輸入框的Web應用程序。 HTML代碼：JavaScript事件未在引導模式中的元素上觸發

<form class="form-price"> 
    <input type="text" class="form-control keypad-line" id="price-value" onfocus="blur()"/> 
    <div class="keypad-line"> 
     <a data-target="#price-value" class="btn btn-default keypad-btn value-key">7</a> 
     <a data-target="#price-value" class="btn btn-default keypad-btn value-key">8</a> 
     <a data-target="#price-value" class="btn btn-default keypad-btn value-key">9</a> 
    </div> 
    <div class="keypad-line"> 
     <a data-target="#price-value" class="btn btn-default keypad-btn value-key">4</a> 
     <a data-target="#price-value" class="btn btn-default keypad-btn value-key">5</a> 
     <a data-target="#price-value" class="btn btn-default keypad-btn value-key">6</a> 
    </div> 
    <div class="keypad-line"> 
     <a data-target="#price-value" class="btn btn-default keypad-btn value-key">1</a> 
     <a data-target="#price-value" class="btn btn-default keypad-btn value-key">2</a> 
     <a data-target="#price-value" class="btn btn-default keypad-btn value-key">3</a> 
    </div> 
    <div class="keypad-line"> 
     <a data-target="#price-value" class="btn btn-danger keypad-btn delete-key"> 
     <span class="glyphicon glyphicon-arrow-left"></span> 
     </a> 
     <a data-target="#price-value" class="btn btn-default keypad-btn value-key">0</a> 
     <a data-target="#price-value" class="btn btn-default keypad-btn value-key">.</a> 
    </div> 
</form>

JAVASCRIPT：

$(function(){ 
    $(".value-key").click(function(){ 
     alert("hit"); 
     var inputTarget = $(this).data("target"); 
     $(inputTarget).val($(inputTarget).val() + $(this).html()); 
    }); 
    $(".delete-key").click(function(){ 
     var inputTarget = $(this).data("target"); 
     $(inputTarget).val($(inputTarget).val().substr(0,$(inputTarget).val().length-1)); 
    }); 
    $(".debug-key").click(function(){ 
     var inputTarget = $(this).data("target"); 
     alert($(inputTarget).val()); 
    }); 
});

該鍵盤在使用中，在我的代碼中的許多地方，功能齊全。我遇到的問題是，如果我把鍵盤放在Bootstrap Modal中，javascript中的click事件不會關閉。我不知道是什麼導致了這一點，我有一個JavaScript庫（bootbox.js），它構建模式並將其添加到html正文的底部。我已經雙重檢查了模態中的代碼是否正確，並且如果從模態中複製出來，它就會起作用。任何幫助，非常感謝。

來源

2013-11-24 leumas95

我猜模態是動態的，你需要委託事件處理程序，並且應該有一百萬個如何在jQuery中使用委託事件處理程序的答案，所以只需要搜索。 – adeneo

$（「body」）。on（「click」，「.value-key」，function（）{ – Hugeen

在一些研究員到我的內容是如何動態的工作以及如何JS作品添加了一個電話到我的keypad.js文件在動態模式構造鍵盤上方，從而元素初始化當該功能被創建時。

謝謝大家指點我在正確的方向。

來源

2013-11-24 13:58:24 leumas95

看來你在Bootstrap Modal元素創建之前初始化了這個函數，可能你可以嘗試委託點擊事件，它應該是工作的。

如：

$('body').on('click', '.value-key', function() { 
    // some code here 
});

來源

2013-11-24 13:51:44 Fancyoung

JavaScript事件未在引導模式中的元素上觸發

回答

相關問題