弹出点击单选按钮

Question

I have two radio buttons as following in a form

<input name="exservman" id="yes" value="1" <?php echo $exserY;?>  type="radio" data-title="Ex-servicemen" class="btn btn-primary my-popover">Yes
 <input type="radio" name="physical" id="phyno" value="0">No

The problem I am having is although on selecting the radio button popup appears but i want to close it by on click NO radio button.

Here is the JS

var $elements = $('.my-popoverr');
$elements.each(function () {
    var $element = $(this);

    $element.popover({
        html: true,
        placement: 'top',
        container: $('body'), 
        content: $('#content').html()
    });

    $element.on('shown.bs.popover', function () {
        var popover = $element.data('bs.popover');
        if (typeof popover !== "undefined") {
            var $tip = popover.tip();
            zindex = $tip.css('z-index');

            $tip.find('.close').bind('click', function () {
                popover.hide();
            });

            $tip.mouseover(function () {
                $tip.css('z-index', function () {
                    return zindex + 1;
                });
            })
                .mouseout(function () {
                $tip.css('z-index', function () {
                    return zindex;
                });
            });
        }
    });
});

Answer 1

You want to use the onchange event for radio buttons instead of the onclick one.

So I would suggest something like this in your code:

$tip.find('.close').bind('change', function () {
  popover.hide();
});