2016-11-10 8 views
1

Ich versuche, einen Eingabewert mit Clipboard.js zu kopieren: https://clipboardjs.com/. Der Eingang ist in einem modalen befindet:Clipboard.js funktioniert nicht in Bootstrap modal

http://codepen.io/Deka87/pen/eBJOKY

new Clipboard('#copy', { 
    text: function(trigger) { 
     return $("#copy-input").val(); 
    } 
}); 

Während es außerhalb des modalen funktioniert, ist es nicht funktioniert, wenn der Eingang und die Kopiertaste in einem modalen Fenster befinden. Ich habe versucht, die Zwischenablage-Funktion zu initialisieren, nachdem das modale Fenster geöffnet ist:

$(".modal").on("shown.bs.modal", function() { 
    new Clipboard('#copy', { 
     text: function(trigger) { 
      return $("#copy-input").val(); 
     } 
    }); 
}); 

Allerdings hat es das Problem nicht gelöst. Irgendwelche Ideen?

+0

Ein Problem in Bezug auf Inkompatibilitäten mit Bootstrap modals angemeldet wurde https://github.com/zenorocha/clipboard.js/issues/155 – peter

Antwort

2

Versuchen Sie, diese Gabel: http://codepen.io/anon/pen/NbxWbQ ich die console.log so einfach ignorieren entfernen vergessen, dass :)

<input type="text" class="form-control" id="copy-input" value="Copied successfully!"/> 
    <br /> 
    <a href="#" id="copy" data-clipboard-target="#copy-input" class="btn btn-default">Copy input content to clipboard</a> 

und

$(".modal").on("shown.bs.modal", function() { 
    console.log('a', Clipboard, $('#copy'), $("#copy-input").val()); 
    var clipboard = new Clipboard('#copy') 
}); 
+0

Nun, Sie haben das ein wenig zu kompliziert gemacht - was ich getan habe, war nur das grundlegende Beispiel aus der Zwischenablage zu verwenden. js docs :) – marcinrek

Verwandte Themen