ul li 각각 onclick tr td

-----상황------

< ul li 예시 >

아래와같은 경우 ${resultSet.PAGE_NO} 를 클릭시  onclick="openPage();" 와 onclick="fnDetail(this);" 두 함수가 같이 실행 됨

 

여기서 ${resultSet.PAGE_NO} 를 클릭시  onclick="openPage();"  함수만 실행되게 하고싶음

 

 <ul name="detail" onclick="goDetail(this);">               

                 <li>${resultSet.NO}</li>
                 <li>

                   <a href='javascript: void(0);' name="List" onclick="openPage();">${resultSet.PAGE_NO}</a>

                </li>
                <li>${resultSet.CHECK_DT}</li>
                <li>${resultSet.COMP_DT}</li>

 

  </ul>

 

방법 :

 

onclick=" event.cancelBubble = true;" 로 이벤트 번짐을 막아야하는데

<a>태그에서 onclick에 해도되고 href가 아닌 onclick에서 이벤트 제어해야함

 

 

 <ul name="detail" onclick="goDetail(this);">                

                 <li>${resultSet.NO}</li>
                 <li onclick=" event.cancelBubble = true;">
                    <a name="List" onclick="openPage();">${resultSet.PAGE_NO}</a>
                </li>
                <li>${resultSet.CHECK_DT}</li>
                <li>${resultSet.COMP_DT}</li>

 

  </ul>

 

 

< tr td 예시 >

 

<table>
<tr onclick="javascript:실행1">
<td><a href="javascript:실행2">실행</a></td>
</tr>
</table>

 

위와같은 상황인 경우

싱행을 클릭시 실행1과 실행2과 동시에 실행되는 상황인데

실행2클릭시 실행2만 클릭되게 하는 방법은?

 

 

<table>
<tr onclick="javascript:실행1">
<td><a href="javascript:실행2">실행</a></td>
</tr>
</table>

↓

<table>
<tr onclick="실행1()">
<td onclick=" event.cancelBubble = true;">
<a href="javascript:실행2">실행</a>
</td>
</tr>
</table>


이렇게하면 됨

a태그에서 onclick에서 해도 될거임
href가 아닌 이벤트제어인 onclick에서 이벤트 번짐을 막아야함