仅为链接行中的特定链接禁用链接

时间:2017-04-22 13:12:26

标签: javascript jquery html css twitter-bootstrap

该链接提供了整行。这样当点击复选框时&明星,它带我到链接页面,但它不应该带我到链接页面,我搜索&我没有得到结果。由于我是新手,我无法挺身而出。有没有办法阻止行中特定td的链接?如果是的话,你能解释一下吗?

$(".star-ttip").tooltip({
	title: 'Star'
});
$(".inquiries #check-all").click(function() {
	if ($("#check-all").is(':checked')) {
		$(".inquiries input[type=checkbox]").each(function() {
			$(this).prop("checked", true);
			$(this).closest('tr').addClass("inq-checked-clr clr-blk");
			$(this).parents().find('.mini').addClass("clr-blk");
		});
	} else {
		$(".inquiries input[type=checkbox]").each(function() {
			$(this).prop("checked", false);
			$(this).closest('tr').removeClass("inq-checked-clr clr-blk");
			$(this).parents().find('.mini').removeClass("clr-blk");
		});
	}
});
$(".inquiries>tbody>tr>td>input[type='checkbox']").change(function() {
	if ($(this).is(":checked")) {
		$(this).closest('tr').addClass("inq-checked-clr clr-blk");
		$(this).closest('tr').removeClass(".table-hover");
		$(this).parents().find('.mini').addClass("clr-blk");
	} else {
		$(this).closest('tr').removeClass("inq-checked-clr clr-blk");
		$(this).parents().find('.mini').removeClass("clr-blk");
	}
});
.table-inbox {
	border: 1px solid #d3d3d3;
	margin-bottom: 0;
}
.table-inbox tr td {
	padding: 11px !important;
}
.table-inbox tr td:hover {
	cursor: pointer;
}
.table-inbox tr td .fa-star.inbox-started, .table-inbox tr td .fa-star:hover {
	color: #ffcc29;
}
.table-inbox tr td .fa-star {
	color: #d5d5d5;
}
.mail-option {
	width: 100%;
	text-align: right;
	border: 1px solid #ccc;
	border-bottom: none;
}
.mail-option .chk-all, .mail-option .btn-group a.btn {
	background: none repeat scroll 0 0 #fcfcfc;
	border: 1px solid #e7e7e7;
	border-radius: 0px !important;
	color: #afafaf;
	display: inline-block;
	padding: 12px 10px;
}
.mail-option .chk-all input[type="checkbox"] {
	margin-top: 0;
}
.mail-option .btn-group a.all {
	border: medium none;
	padding: 0;
}
.heading-inbox h4 {
	border-bottom: 1px solid #ddd;
	color: #444;
	font-size: 18px;
	margin-top: 20px;
	padding-bottom: 10px;
}
.mail-option>div:first-child {
	padding: 14px 0px 0px 10px;
}
thead {
	color: #ccc;
}
.inquiries {
	border-collapse: initial !important;
}
.inquiries>thead>tr>th {
	border-bottom: none;
	padding: 4px 8px;
	font-weight: normal;
}
.inquiries tbody tr td:last-child {
	width: 11%;
}
.inquiries tbody tr td:nth-child(3) {
	width: 25%;
	/*padding-left: 0px !important;*/
}
.inquiries tbody tr td:nth-child(2) {
	padding-right: 0px !important;
}
.sender-img {
	border-radius: 50%;
	margin-right: 6px;
	/*vertical-align: top;*/
}
.inquire-progress {
	margin: 5px 5px 10px;
	background-color: #fff;
	border: 1px solid #ccc;
	width: 190px;
}
.inquiries>thead>tr>th>input {
	margin-left: 3px;
}
.clr-blk {
	color: #000 !important;
}
.inquire-noti {
	border-radius: 50%;
	font-size: 12px;
}
.mail-option>div>a {}
.tabbable-panel {}
.tabbable-line {
	padding-bottom: 18px;
}
.tabbable-line>.nav-tabs {
	border-bottom: 1px solid #ccc;
	margin: 0px;
}
.tabbable-line>.nav-tabs>li {
	margin-right: 2px;
}
.tabbable-line>.nav-tabs>li:last-child:before {
	content: "";
	position: absolute;
	left: -9px;
	bottom: -11px;
	border-bottom: 9px solid #fff;
	border-right: 9px solid transparent;
	border-left: 9px solid transparent;
}
.tabbable-line>.nav-tabs>li.pointer {
	position: absolute;
	width: 0;
	height: 0;
	left: 44px;
	bottom: 19px;
	margin: 0;
	border-bottom: 10px solid #dddddd;
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
}
.tabbable-line>.nav-tabs>li>a {
	border: 0;
	margin-right: 0;
	color: #737373;
	font-size: 17px;
}
.tabbable-line>.nav>li>a:hover {
	background-color: transparent;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<table class="table table-inbox table-hover inquiries table-responsive">

              	<thead> 
                	<tr>
                		<th colspan="">
                      <input type="checkbox" id="check-all">
                    </th>
                    <th style="visibility: hidden;"></th>
                		<!-- <th><span class="btn-group">
              <button type="button" class="dropdown-toggle select-all-drpdwn-icon" data-toggle="dropdown" id="select-all">
                  <span class="caret"></span><span class="sr-only">Toggle Dropdown</span>
              </button>
              <ul class="dropdown-menu select-all-drpdwn" role="menu">
                  <li><a href="#">All</a></li>
                  <li><a href="#">None</a></li>
                  <li><a href="#">Read</a></li>
                  <li><a href="#">Unread</a></li>
                  <li><a href="#">Starred</a></li>
                  <li><a href="#">Unstarred</a></li>
              </ul>
          </span></th> -->
                		<th>SENDER</th>
                		<th>SUBJECT</th>
                		<th>COUNTRY</th>
                		<th>UPDATED</th>
            		  </tr>
          		  </thead>
                <tbody>
                  <tr class="unread" onclick="document.location = 'http://www.google.com';">
                    <td class="inbox-small-cells">
                        <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message  dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Santhosh naarayanan</td>
                    <td class="view-message ">Hello sir...</td>
                    <td class="view-message  dont-show">India</td>
                    <td class="view-message">9:27 AM</td>
                  </tr>
                  <tr class="unread" onclick="document.location = 'http://www.google.com';">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Ilaya raja </td>
                    <td class="view-message">Hi...santhosh, Wasup?</td>
                    <td class="view-message inbox-small-cells">UK</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="" onclick="document.location = 'http://www.google.com';">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Anirudh</td>
                    <td class="view-message">Thaara thappatai Awsome sir.. </td>
                    <td class="view-message inbox-small-cells">Canada</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="" onclick="document.location = 'http://www.google.com';">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Aadhi</td>
                    <td class="view-message">Yes, it was nice</td>
                    <td class="view-message inbox-small-cells">
                    	China
                    </td>
                    <td class="view-message">Apr 01, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="unread">
                    <td class="inbox-small-cells">
                        <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message  dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Santhosh naarayanan</td>
                    <td class="view-message ">Hello sir...</td>
                    <td class="view-message  dont-show">India</td>
                    <td class="view-message">9:27 AM</td>
                  </tr>
                  <tr class="unread">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Ilaya raja </td>
                    <td class="view-message">Hi...santhosh, Wasup?</td>
                    <td class="view-message inbox-small-cells">UK</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Anirudh</td>
                    <td class="view-message">Thaara thappatai Awsome sir.. </td>
                    <td class="view-message inbox-small-cells">Canada</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Aadhi</td>
                    <td class="view-message">Yes, it was nice</td>
                    <td class="view-message inbox-small-cells">
                      China
                    </td>
                    <td class="view-message">Apr 01, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Aadhi</td>
                    <td class="view-message">Yes, it was nice</td>
                    <td class="view-message inbox-small-cells">
                      China
                    </td>
                    <td class="view-message">Apr 01, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="unread">
                    <td class="inbox-small-cells">
                        <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message  dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Santhosh naarayanan</td>
                    <td class="view-message ">Hello sir...</td>
                    <td class="view-message  dont-show">India</td>
                    <td class="view-message">9:27 AM</td>
                  </tr>
                  <tr class="unread">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Ilaya raja </td>
                    <td class="view-message">Hi...santhosh, Wasup?</td>
                    <td class="view-message inbox-small-cells">UK</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Anirudh</td>
                    <td class="view-message">Thaara thappatai Awsome sir.. </td>
                    <td class="view-message inbox-small-cells">Canada</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Aadhi</td>
                    <td class="view-message">Yes, it was nice</td>
                    <td class="view-message inbox-small-cells">
                      China
                    </td>
                    <td class="view-message">Apr 01, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
              </tbody>
              </table>

3 个答案:

答案 0 :(得分:1)

我将您的代码更改为有效。

我将clickAction类添加到了您想要拥有该事件的行。

$("tr.clickAction> td:not(:nth-child(1), :nth-child(2))").on("click",function(){
   document.location = 'http://www.google.com';
});

$(".star-ttip").tooltip({
	title: 'Star'
});
$(".inquiries #check-all").click(function() {
	if ($("#check-all").is(':checked')) {
		$(".inquiries input[type=checkbox]").each(function() {
			$(this).prop("checked", true);
			$(this).closest('tr').addClass("inq-checked-clr clr-blk");
			$(this).parents().find('.mini').addClass("clr-blk");
		});
	} else {
		$(".inquiries input[type=checkbox]").each(function() {
			$(this).prop("checked", false);
			$(this).closest('tr').removeClass("inq-checked-clr clr-blk");
			$(this).parents().find('.mini').removeClass("clr-blk");
		});
	}
});
$(".inquiries>tbody>tr>td>input[type='checkbox']").change(function() {
	if ($(this).is(":checked")) {
		$(this).closest('tr').addClass("inq-checked-clr clr-blk");
		$(this).closest('tr').removeClass(".table-hover");
		$(this).parents().find('.mini').addClass("clr-blk");
	} else {
		$(this).closest('tr').removeClass("inq-checked-clr clr-blk");
		$(this).parents().find('.mini').removeClass("clr-blk");
	}
});

除了前两个TD之外,这将适用于使用clickAction类在TR内的每个TD上。

.table-inbox {
	border: 1px solid #d3d3d3;
	margin-bottom: 0;
}
.table-inbox tr td {
	padding: 11px !important;
}
.table-inbox tr td:hover {
	cursor: pointer;
}
.table-inbox tr td .fa-star.inbox-started, .table-inbox tr td .fa-star:hover {
	color: #ffcc29;
}
.table-inbox tr td .fa-star {
	color: #d5d5d5;
}
.mail-option {
	width: 100%;
	text-align: right;
	border: 1px solid #ccc;
	border-bottom: none;
}
.mail-option .chk-all, .mail-option .btn-group a.btn {
	background: none repeat scroll 0 0 #fcfcfc;
	border: 1px solid #e7e7e7;
	border-radius: 0px !important;
	color: #afafaf;
	display: inline-block;
	padding: 12px 10px;
}
.mail-option .chk-all input[type="checkbox"] {
	margin-top: 0;
}
.mail-option .btn-group a.all {
	border: medium none;
	padding: 0;
}
.heading-inbox h4 {
	border-bottom: 1px solid #ddd;
	color: #444;
	font-size: 18px;
	margin-top: 20px;
	padding-bottom: 10px;
}
.mail-option>div:first-child {
	padding: 14px 0px 0px 10px;
}
thead {
	color: #ccc;
}
.inquiries {
	border-collapse: initial !important;
}
.inquiries>thead>tr>th {
	border-bottom: none;
	padding: 4px 8px;
	font-weight: normal;
}
.inquiries tbody tr td:last-child {
	width: 11%;
}
.inquiries tbody tr td:nth-child(3) {
	width: 25%;
	/*padding-left: 0px !important;*/
}
.inquiries tbody tr td:nth-child(2) {
	padding-right: 0px !important;
}
.sender-img {
	border-radius: 50%;
	margin-right: 6px;
	/*vertical-align: top;*/
}
.inquire-progress {
	margin: 5px 5px 10px;
	background-color: #fff;
	border: 1px solid #ccc;
	width: 190px;
}
.inquiries>thead>tr>th>input {
	margin-left: 3px;
}
.clr-blk {
	color: #000 !important;
}
.inquire-noti {
	border-radius: 50%;
	font-size: 12px;
}
.mail-option>div>a {}
.tabbable-panel {}
.tabbable-line {
	padding-bottom: 18px;
}
.tabbable-line>.nav-tabs {
	border-bottom: 1px solid #ccc;
	margin: 0px;
}
.tabbable-line>.nav-tabs>li {
	margin-right: 2px;
}
.tabbable-line>.nav-tabs>li:last-child:before {
	content: "";
	position: absolute;
	left: -9px;
	bottom: -11px;
	border-bottom: 9px solid #fff;
	border-right: 9px solid transparent;
	border-left: 9px solid transparent;
}
.tabbable-line>.nav-tabs>li.pointer {
	position: absolute;
	width: 0;
	height: 0;
	left: 44px;
	bottom: 19px;
	margin: 0;
	border-bottom: 10px solid #dddddd;
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
}
.tabbable-line>.nav-tabs>li>a {
	border: 0;
	margin-right: 0;
	color: #737373;
	font-size: 17px;
}
.tabbable-line>.nav>li>a:hover {
	background-color: transparent;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<table class="table table-inbox table-hover inquiries table-responsive">

              	<thead> 
                	<tr>
                		<th colspan="">
                      <input type="checkbox" id="check-all">
                    </th>
                    <th style="visibility: hidden;"></th>
                		<!-- <th><span class="btn-group">
              <button type="button" class="dropdown-toggle select-all-drpdwn-icon" data-toggle="dropdown" id="select-all">
                  <span class="caret"></span><span class="sr-only">Toggle Dropdown</span>
              </button>
              <ul class="dropdown-menu select-all-drpdwn" role="menu">
                  <li><a href="#">All</a></li>
                  <li><a href="#">None</a></li>
                  <li><a href="#">Read</a></li>
                  <li><a href="#">Unread</a></li>
                  <li><a href="#">Starred</a></li>
                  <li><a href="#">Unstarred</a></li>
              </ul>
          </span></th> -->
                		<th>SENDER</th>
                		<th>SUBJECT</th>
                		<th>COUNTRY</th>
                		<th>UPDATED</th>
            		  </tr>
          		  </thead>
                <tbody>
                  <tr class="unread clickAction">
                    <td class="inbox-small-cells">
                        <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 "></i></td>
                    <td class="view-message  dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Santhosh naarayanan</td>
                    <td class="view-message ">Hello sir...</td>
                    <td class="view-message  dont-show">India</td>
                    <td class="view-message">9:27 AM</td>
                  </tr>
                  <tr class="unread clickAction">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 "></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Ilaya raja </td>
                    <td class="view-message">Hi...santhosh, Wasup?</td>
                    <td class="view-message inbox-small-cells">UK</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="clickAction">
                    <td class="inbox-small-cells ">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 "></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Anirudh</td>
                    <td class="view-message">Thaara thappatai Awsome sir.. </td>
                    <td class="view-message inbox-small-cells">Canada</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="clickAction">
                    <td class="inbox-small-cells ">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 "></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Aadhi</td>
                    <td class="view-message">Yes, it was nice</td>
                    <td class="view-message inbox-small-cells">
                    	China
                    </td>
                    <td class="view-message">Apr 01, 16</td>
                  </tr>
                  <tr class="clickAction">
                    <td class="inbox-small-cells ">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started "></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="unread">
                    <td class="inbox-small-cells">
                        <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message  dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Santhosh naarayanan</td>
                    <td class="view-message ">Hello sir...</td>
                    <td class="view-message  dont-show">India</td>
                    <td class="view-message">9:27 AM</td>
                  </tr>
                  <tr class="unread">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Ilaya raja </td>
                    <td class="view-message">Hi...santhosh, Wasup?</td>
                    <td class="view-message inbox-small-cells">UK</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Anirudh</td>
                    <td class="view-message">Thaara thappatai Awsome sir.. </td>
                    <td class="view-message inbox-small-cells">Canada</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Aadhi</td>
                    <td class="view-message">Yes, it was nice</td>
                    <td class="view-message inbox-small-cells">
                      China
                    </td>
                    <td class="view-message">Apr 01, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Aadhi</td>
                    <td class="view-message">Yes, it was nice</td>
                    <td class="view-message inbox-small-cells">
                      China
                    </td>
                    <td class="view-message">Apr 01, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="unread">
                    <td class="inbox-small-cells">
                        <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message  dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Santhosh naarayanan</td>
                    <td class="view-message ">Hello sir...</td>
                    <td class="view-message  dont-show">India</td>
                    <td class="view-message">9:27 AM</td>
                  </tr>
                  <tr class="unread">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Ilaya raja </td>
                    <td class="view-message">Hi...santhosh, Wasup?</td>
                    <td class="view-message inbox-small-cells">UK</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Anirudh</td>
                    <td class="view-message">Thaara thappatai Awsome sir.. </td>
                    <td class="view-message inbox-small-cells">Canada</td>
                    <td class="view-message">Mar 15, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Aadhi</td>
                    <td class="view-message">Yes, it was nice</td>
                    <td class="view-message inbox-small-cells">
                      China
                    </td>
                    <td class="view-message">Apr 01, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
                  <tr class="">
                    <td class="inbox-small-cells">
                      <input type="checkbox" class="mail-checkbox">
                    </td>
                    <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
                    <td class="view-message dont-show"><img src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25" class="sender-img">Pugal </td>
                    <td class="view-message">I'm about sing guys... :) </td>
                    <td class="view-message inbox-small-cells">US</td>
                    <td class="view-message">May 23, 16</td>
                  </tr>
              </tbody>
              </table>
export const withCreateLink = graphql(createLink, {
props({ownProps, mutate}) {
    return {
        createLink(url, description, group) {
            return mutate({
                variables: {
                    url,
                    description,
                    group
                },
                updateQueries: {
                    getAllGroups: (prev, {mutationResult}) => {
                        const newLink = mutationResult.data.createLink;
                        return update(prev, {
                            allGroups: {
                                links: {
                                    $push: [newLink]
                                }
                            }
                        })
                    }
                }
            })
        }
    }
}
});

答案 1 :(得分:0)

试试这段代码 How to prevent row click function on specific column in datatable?或者您可以查看此链接 Disable on-click event for single column 您可以阻止特定列执行onclick函数,但您必须将该列索引提供给您的javascript函数或通过css类 为您的代码

table td:nth-child(2) {
    pointer-events: none;
}
table td:nth-child(1) {
    pointer-events: none;
}

将其添加到样式表

答案 2 :(得分:0)

因为你有一个带有重定向动作的内联onClick事件处理程序,你可以只选择那些行,并在单击内部单元格时停止传播到该行。

要添加的代码:

$('table.table tbody tr[onClick] td').on('click', function (e) {
      e.stopPropagation();
});

选择器'.table tbody tr [onClick] td'表示:选择一个具有类表的表,因此获取tbody元素,并且对于每个包含的行,只选择具有属性onClick的行。对于每一行,只获取相关的td元素。

e.stopPropagation():阻止事件冒泡DOM树,防止任何父处理程序被通知事件。 (即:停止将事件传播到相应的行,因此不会执行内联onClick)

//
//  ADD THIS LINE
//
$('table.table tbody tr[onClick] td').on('click', function (e) {
    e.stopPropagation();
    console.log('Stopped propagation for: ' + this.tagName);
});


$(".star-ttip").tooltip({
    title: 'Star'
});
$(".inquiries #check-all").click(function () {
    if ($("#check-all").is(':checked')) {
        $(".inquiries input[type=checkbox]").each(function () {
            $(this).prop("checked", true);
            $(this).closest('tr').addClass("inq-checked-clr clr-blk");
            $(this).parents().find('.mini').addClass("clr-blk");
        });
    } else {
        $(".inquiries input[type=checkbox]").each(function () {
            $(this).prop("checked", false);
            $(this).closest('tr').removeClass("inq-checked-clr clr-blk");
            $(this).parents().find('.mini').removeClass("clr-blk");
        });
    }
});
$(".inquiries>tbody>tr>td>input[type='checkbox']").change(function () {
    if ($(this).is(":checked")) {
        $(this).closest('tr').addClass("inq-checked-clr clr-blk");
        $(this).closest('tr').removeClass(".table-hover");
        $(this).parents().find('.mini').addClass("clr-blk");
    } else {
        $(this).closest('tr').removeClass("inq-checked-clr clr-blk");
        $(this).parents().find('.mini').removeClass("clr-blk");
    }
});
.table-inbox {
    border: 1px solid #d3d3d3;
    margin-bottom: 0;
}

.table-inbox tr td {
    padding: 11px !important;
}

.table-inbox tr td:hover {
    cursor: pointer;
}

.table-inbox tr td .fa-star.inbox-started, .table-inbox tr td .fa-star:hover {
    color: #ffcc29;
}

.table-inbox tr td .fa-star {
    color: #d5d5d5;
}

.mail-option {
    width: 100%;
    text-align: right;
    border: 1px solid #ccc;
    border-bottom: none;
}

.mail-option .chk-all, .mail-option .btn-group a.btn {
    background: none repeat scroll 0 0 #fcfcfc;
    border: 1px solid #e7e7e7;
    border-radius: 0px !important;
    color: #afafaf;
    display: inline-block;
    padding: 12px 10px;
}

.mail-option .chk-all input[type="checkbox"] {
    margin-top: 0;
}

.mail-option .btn-group a.all {
    border: medium none;
    padding: 0;
}

.heading-inbox h4 {
    border-bottom: 1px solid #ddd;
    color: #444;
    font-size: 18px;
    margin-top: 20px;
    padding-bottom: 10px;
}

.mail-option > div:first-child {
    padding: 14px 0px 0px 10px;
}

thead {
    color: #ccc;
}

.inquiries {
    border-collapse: initial !important;
}

.inquiries > thead > tr > th {
    border-bottom: none;
    padding: 4px 8px;
    font-weight: normal;
}

.inquiries tbody tr td:last-child {
    width: 11%;
}

.inquiries tbody tr td:nth-child(3) {
    width: 25%;
    /*padding-left: 0px !important;*/
}

.inquiries tbody tr td:nth-child(2) {
    padding-right: 0px !important;
}

.sender-img {
    border-radius: 50%;
    margin-right: 6px;
    /*vertical-align: top;*/
}

.inquire-progress {
    margin: 5px 5px 10px;
    background-color: #fff;
    border: 1px solid #ccc;
    width: 190px;
}

.inquiries > thead > tr > th > input {
    margin-left: 3px;
}

.clr-blk {
    color: #000 !important;
}

.inquire-noti {
    border-radius: 50%;
    font-size: 12px;
}

.mail-option > div > a {
}

.tabbable-panel {
}

.tabbable-line {
    padding-bottom: 18px;
}

.tabbable-line > .nav-tabs {
    border-bottom: 1px solid #ccc;
    margin: 0px;
}

.tabbable-line > .nav-tabs > li {
    margin-right: 2px;
}

.tabbable-line > .nav-tabs > li:last-child:before {
    content: "";
    position: absolute;
    left: -9px;
    bottom: -11px;
    border-bottom: 9px solid #fff;
    border-right: 9px solid transparent;
    border-left: 9px solid transparent;
}

.tabbable-line > .nav-tabs > li.pointer {
    position: absolute;
    width: 0;
    height: 0;
    left: 44px;
    bottom: 19px;
    margin: 0;
    border-bottom: 10px solid #dddddd;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
}

.tabbable-line > .nav-tabs > li > a {
    border: 0;
    margin-right: 0;
    color: #737373;
    font-size: 17px;
}

.tabbable-line > .nav > li > a:hover {
    background-color: transparent;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<table class="table table-inbox table-hover inquiries table-responsive">

    <thead>
    <tr>
        <th colspan="">
            <input type="checkbox" id="check-all">
        </th>
        <th style="visibility: hidden;"></th>
        <!-- <th><span class="btn-group">
<button type="button" class="dropdown-toggle select-all-drpdwn-icon" data-toggle="dropdown" id="select-all">
  <span class="caret"></span><span class="sr-only">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu select-all-drpdwn" role="menu">
  <li><a href="#">All</a></li>
  <li><a href="#">None</a></li>
  <li><a href="#">Read</a></li>
  <li><a href="#">Unread</a></li>
  <li><a href="#">Starred</a></li>
  <li><a href="#">Unstarred</a></li>
</ul>
</span></th> -->
        <th>SENDER</th>
        <th>SUBJECT</th>
        <th>COUNTRY</th>
        <th>UPDATED</th>
    </tr>
    </thead>
    <tbody>
    <tr class="unread" onclick="document.location = 'http://www.google.com';">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message  dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Santhosh naarayanan
        </td>
        <td class="view-message ">Hello sir...</td>
        <td class="view-message  dont-show">India</td>
        <td class="view-message">9:27 AM</td>
    </tr>
    <tr class="unread" onclick="document.location = 'http://www.google.com';">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Ilaya raja
        </td>
        <td class="view-message">Hi...santhosh, Wasup?</td>
        <td class="view-message inbox-small-cells">UK</td>
        <td class="view-message">Mar 15, 16</td>
    </tr>
    <tr class="" onclick="document.location = 'http://www.google.com';">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Anirudh
        </td>
        <td class="view-message">Thaara thappatai Awsome sir..</td>
        <td class="view-message inbox-small-cells">Canada</td>
        <td class="view-message">Mar 15, 16</td>
    </tr>
    <tr class="" onclick="document.location = 'http://www.google.com';">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Aadhi
        </td>
        <td class="view-message">Yes, it was nice</td>
        <td class="view-message inbox-small-cells">
            China
        </td>
        <td class="view-message">Apr 01, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Pugal
        </td>
        <td class="view-message">I'm about sing guys... :)</td>
        <td class="view-message inbox-small-cells">US</td>
        <td class="view-message">May 23, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Pugal
        </td>
        <td class="view-message">I'm about sing guys... :)</td>
        <td class="view-message inbox-small-cells">US</td>
        <td class="view-message">May 23, 16</td>
    </tr>
    <tr class="unread">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message  dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Santhosh naarayanan
        </td>
        <td class="view-message ">Hello sir...</td>
        <td class="view-message  dont-show">India</td>
        <td class="view-message">9:27 AM</td>
    </tr>
    <tr class="unread">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Ilaya raja
        </td>
        <td class="view-message">Hi...santhosh, Wasup?</td>
        <td class="view-message inbox-small-cells">UK</td>
        <td class="view-message">Mar 15, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Anirudh
        </td>
        <td class="view-message">Thaara thappatai Awsome sir..</td>
        <td class="view-message inbox-small-cells">Canada</td>
        <td class="view-message">Mar 15, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Aadhi
        </td>
        <td class="view-message">Yes, it was nice</td>
        <td class="view-message inbox-small-cells">
            China
        </td>
        <td class="view-message">Apr 01, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Pugal
        </td>
        <td class="view-message">I'm about sing guys... :)</td>
        <td class="view-message inbox-small-cells">US</td>
        <td class="view-message">May 23, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Pugal
        </td>
        <td class="view-message">I'm about sing guys... :)</td>
        <td class="view-message inbox-small-cells">US</td>
        <td class="view-message">May 23, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Aadhi
        </td>
        <td class="view-message">Yes, it was nice</td>
        <td class="view-message inbox-small-cells">
            China
        </td>
        <td class="view-message">Apr 01, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Pugal
        </td>
        <td class="view-message">I'm about sing guys... :)</td>
        <td class="view-message inbox-small-cells">US</td>
        <td class="view-message">May 23, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Pugal
        </td>
        <td class="view-message">I'm about sing guys... :)</td>
        <td class="view-message inbox-small-cells">US</td>
        <td class="view-message">May 23, 16</td>
    </tr>
    <tr class="unread">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message  dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Santhosh naarayanan
        </td>
        <td class="view-message ">Hello sir...</td>
        <td class="view-message  dont-show">India</td>
        <td class="view-message">9:27 AM</td>
    </tr>
    <tr class="unread">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Ilaya raja
        </td>
        <td class="view-message">Hi...santhosh, Wasup?</td>
        <td class="view-message inbox-small-cells">UK</td>
        <td class="view-message">Mar 15, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Anirudh
        </td>
        <td class="view-message">Thaara thappatai Awsome sir..</td>
        <td class="view-message inbox-small-cells">Canada</td>
        <td class="view-message">Mar 15, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Aadhi
        </td>
        <td class="view-message">Yes, it was nice</td>
        <td class="view-message inbox-small-cells">
            China
        </td>
        <td class="view-message">Apr 01, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Pugal
        </td>
        <td class="view-message">I'm about sing guys... :)</td>
        <td class="view-message inbox-small-cells">US</td>
        <td class="view-message">May 23, 16</td>
    </tr>
    <tr class="">
        <td class="inbox-small-cells">
            <input type="checkbox" class="mail-checkbox">
        </td>
        <td class=""><i class="fa fa-star star-ttip fnt-size-18 inbox-started"></i></td>
        <td class="view-message dont-show"><img
                src="https://cdn.paperindex.com/piimages/left-column/prompt-customer-service.jpg" width="25" height="25"
                class="sender-img">Pugal
        </td>
        <td class="view-message">I'm about sing guys... :)</td>
        <td class="view-message inbox-small-cells">US</td>
        <td class="view-message">May 23, 16</td>
    </tr>
    </tbody>
</table>