使用複選框標記行刪除

我有這個收件箱或郵件，我需要使用複選框標記多個刪除。問題是，當我點擊複選框時，由於標籤內部的onclick，它總是進入方法read（）。我想要的只是簡單的標記。請參閱下面的代碼：使用複選框標記行刪除

@foreach ($messages as $message)  
    <tr onclick="document.location='{{route('account.message.read', array($message->id))}}'"> 
    <td> <input type="checkbox" name="msg" value="{{$message->id}}"></td> 
    <td><strong>{{Str::words($message->subject, 5, '...')}}</strong> {{Str::words($message->message, 20, '...')}}</td> 
    </tr> 
@endforeach

現在我怎麼能標記每一行，而無需進入該方法？我是一個新手btw。

來源

2015-10-22 KristCont

如果要選擇多個元素，然後從'checkbox'標籤刪除'onclick'參數。對於多次刪除，創建另一個按鈕並添加修改的'onclick'參數，刪除所有標記的元素。 – CrakC

@CrakC對於我發佈的代碼，在複選框內沒有onclick參數。我沒有感到抱歉。我想標記每一行並一次刪除所有標記的行。 – KristCont

好的，我錯了。然而，你已經爲'tr'標籤包含了一個'onclick'參數，這意味着它內部的任何元素在點擊時都會觸發'onclick'事件。通過將'onclick'參數添加到位於「複選框」旁邊的'div'或'span'或'p'幷包含電子郵件的主題來嘗試一種解決方法。 – CrakC

所有你需要的附加處理程序checkbox和使用stopPropagation冒泡成的大樹，見下面的例子：

HTML

認爲我們有onclick內嵌錶行JavaScript和它裏面有input：

<table> 
    <tr onclick="return alert('Hai')"> 
    <td> 
     <input type="checkbox" />Click Me 
    </td> 
    </tr> 
<table>

而且這裏的處理程序：

$('input').click(function(e){ 
    // normally if we removed this line of code 
    // alert will getting called as checkbox is checked/unchecked 
    // was inside table rows 
    // but with this propagation, we disabled it 
    // from bubbling up into tree 
    e.stopPropagation(); 
});

DEMO

來源

2015-10-22 03:29:41

謝謝你這個解決方案效果很好。正是我在找什麼。 – KristCont

很高興聽到這個消息，歡迎大家 –

你可以把標籤中的onclick不包括複選框細胞

否則，你可以調用一個實際的onclick功能，同時捕獲click事件，並檢查x大於可以說50像素！

<script type="text/javascript"> 
 
document.getElementById('emailRow1').addEventListener("click",function(e){ 
 
\t var x=e.pageX-this.offsetLeft; 
 
\t if(x>50){ 
 
\t \t rowClicked(); 
 
\t } 
 
\t },true); 
 
</script>

<table><tbody><tr id='emailRow1'><td style="width:50px;">This area wont trigger onclick</td><td>I trigger onclick</td><td>i trigger onclick</td>

然後你就可以在對象上設置自定義參數，並使用this.customPropertyName確定單擊了哪一行記得他們！希望這有助於

來源

2015-10-22 03:13:16 PC3TJ

謝謝。這將工作，但我會繼續重複將onclick在每個..我有更多的把這個行像郵件的主題和發件人。 – KristCont

我編輯了我的答案。我認爲上面的代碼可以通過在你的html或JScript中實現cutom屬性來更好地提高頁面的可伸縮性，並且通過javascript而不是HREF設置你的onclicks，但是作爲@Norilihazmey手頭問題的一般回答，它有最簡單的答案到你的問題 – PC3TJ

謝謝。你的答案可以工作，而且很好。我同意你的觀點，Norilihazmey有簡單的解決方案。 – KristCont

使用複選框標記行刪除

回答

相關問題