如何在模态可点击内制作图像

时间:2016-02-27 05:14:28

标签: javascript jquery twitter-bootstrap bootstrap-modal

我有一个按钮,显示一个包含许多图标的模态,当我点击其中一个图像时,我想要它,这表示我已点击它。但我不知道如何实现它。

到目前为止,这就是我的模态的样子。 Modal Image

我的目标:点击我点击它的指标。 enter image description here

CODE

<div class="modal-body">
    <div class="row">
        <div class="col-lg-6 pull-left">
            <?php 
                $tokenSql = mysql_query(" SELECT * FROM topplayer WHERE user_id = '$user_id' ");
                $retToken = mysql_fetch_assoc($tokenSql);
                $token = $retToken['token'];
                echo ("<b>Tokens : $token </b><br>");
             ?>
        </div>
        <div class="col-lg-6 pull-right">
        </div>
     </div>
        <div class="row ml">
            <?php 
                $sendGiftSql = mysql_query("SELECT * FROM gifts WHERE isDelete = 'false' ORDER BY price ");
                while($sendGift = mysql_fetch_assoc($sendGiftSql)){
                        $giftIMG = $sendGift['img_path'];
                        echo("
                            <div class='col-xs-4 mb'>
                              <br>
                              <img id='edgiftPhoto'  class='center-block' alt='No image' src='$giftIMG' style='height:120px; width: 120px'/>&nbsp;
                            </div> 
                    ");
                }
            ?>
</div>

1 个答案:

答案 0 :(得分:0)

通用,超级超级简单的解决方案。不需要插件。

JS:

$('.modal-body').on('click','img',function(){
    $(this).toggleClass('clicked');
})

CSS:

.clicked{
    border:1px solid black;
    //style it however you want
}