Wie kann ein Ereignis für ein Element ein Bootstrap-Popover auf einem anderen Element verursachen?

Question

Am versuchen, eine Bild-Upload-Button mit js zu erstellen, dass die folgenden Funktionen .... auf Klick (erreicht)

1) Pop Up Dateiauswahl

in einem Bootstrap

2) Vorschaubild ausgewählt haben Popover, wenn das Bild aus Dateiauswahl ausgewählt wird ...

Die Schaltfläche enthält eine Eingabe-Tag des Typs Datei, mit einer CSS-Klasse (.file-Eingänge), die keine Anzeige auf das Element anwendet, also kann ich nicht hinzufügen das Popover zum Eingabe-Tag, da Popovers nicht mit versteckten Elementen funktionieren, wie kann ich das Popover auf der sichtbaren Schaltfläche anzeigen, wenn der Wert des Eingabe-Tags geändert wird

Vielleicht so etwas wie so

$('#photo').change()(function(){ 
 
    
 
if(!($("#photo").val() == '')){ 
 
    
 
    //Use bootstrap popover to show image over button 
 
    
 
     
 
    }); 
 
    
 
    });

Hier ist die Schaltfläche Code

<button class="btn btn-default" rel="popover" id="btn-photo"> 
 
    <i class="glyphicon glyphicon-picture"></i> 
 
    <input class="file-inputs" type="file" name="photo" id="photo" /> 
 
</button>

Und hier ist die js

$(document).ready(function() { 
 

 
    var img = ''; 
 

 
    //Event to display file chooser 
 
    $('.post-box').on('click', '#btn-photo', function() { 
 
    event.preventDefault(); 
 
    var elem = document.getElementById('photo'); 
 
    if (elem && document.createEvent) { 
 
     var evt = document.createEvent("MouseEvents"); 
 
     // Event(event_type:String, bubbles:Boolean, cancelable:Boolean) 
 
     evt.initEvent("click", false, true); 
 
     elem.dispatchEvent(evt); 
 

 

 
    } 
 

 

 
    }); 
 

 
    // Show popover on button 
 

 
    $("#btn-photo").popover({ 
 
    placement: 'top', 
 
    trigger: 'click', 
 
    title: 'Add a picture to your post! :)', 
 
    content: img, 
 
    html: true 
 
    }); 
 
    // }); 
 

 
});

Answer 1

Eine schnelle Antwort ist so etwas wie diese:

$("#yourbutton").on("yourevent", function(){$("#otherbutton").trigger("click");});