各位大大好:

想請問 如何a區塊跟b區塊功能不互相干擾
因為我點<a> <div>父元素的視窗會跳出來，希望只有子元素的視窗跳出來
要怎麼讓子區塊動作時，父區塊不干擾 謝謝!
http://www.ee.nsysu.edu.tw/key/c1.php
例如:表格中的標題，只會顯示popup 不會顯示modal 要點表格的空白處只會顯示modal不會顯示popup..
css

.overlay:target {
  visibility: visible;
  opacity: 1;
}

.popup .close {
  position: absolute;
  top: 2px;
  right: 20px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
  background-color:#FFA488;
}


@media screen and (max-width: 700px){
  .box{
    width: 70%;
  }
  .popup{
    width: 70%;
  }
}

js 本來想說點<a>標籤不會影響到div但兩個都會跑出來

function abcd(){

var q=location.href;

if(q.match("popup1")!=-1){


$('.change').attr('data-target', '#exampleModal');

}

}


function abc(){



$('.change').removeAttr('data-target');

}

表格的語法

for($x=0;$x<=41;$x++){
    	
    
echo'<div class="change" onclick="abcd()" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">'."[$day]";
$conn= new PDO("mysql:host=$hostdb;dbname=$namedb",$userdb,$passdb);
$conn->exec("SET CHARACTER SET utf8");
$sql1="select * from ".changeMonth($yue)." where bdate= :Bdate"; //單冒號宣布冒號裡的字串 雙冒號是分析這個冒號裡的語法
$sql =$conn->prepare($sql1);
$ar_val=array('Bdate'=>$Y."-".$yue."-".$singleday);//sql叫出資料語法            
if($sql->execute($ar_val)){
   $row =$sql->fetchALL();          	
   }

   foreach($row as $row1){
    	    echo '<a class="button" href="#popup1"onclick="abc()">';
    	    echo "<br>•".$row1['timest']." ".$row1['clr']."</a>";
            }
            echo '</div>';      	   	       
    	    ++$day;	    	
    	  }
    	  }

modal

<div class="modal fade " id="exampleModal"  role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">    
  <div class="modal-dialog" role="document">
    <div class="modal-content">
        
        
           
            

          
         <div class="form-group">
            <label for="message-text" class="col-form-label" >事由:</label>
            <textarea class="form-control" id="thing"></textarea>
          </div>

      
     
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" id="send" class="btn btn-primary" onclick="myFunction()">Send message</button>
        
      </div>
    
    </div>
  </div>
</div>

popup

<div id="popup1" class="overlay">
<div class="popup">
<h2>Here i am</h2>
<a class="close" href="#">×</a>
<div class="content">
Thank to pop me out of that button, but now i'm done so you can close this window.
</div>
</div>
</div>