使用javascript禁用HTML的href值

如何基於數據禁用href？下面有一張表格顯示數據。點擊Clik Here時，數據將被髮送到數據庫。使用javascript禁用HTML的href值

<table> 
    <thead> 
    <tr> 
     <th>Name</th> 
     <th>Age</th> 
     <th>Address</th> 
     <th>Button</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td>Mr.XX</td> 
     <td>20</td> 
     <td>Street XX</td> 
     <td><a name=sendName id=sendId href="#" >Clik Here</a></td> 
    </tr> 
    </tbody> 
</table>

然而，當age細胞不等於20，爲Click Here的href應禁用，以使得用戶可以在數據未發送到數據庫。

來源

2013-08-29 art

請問您可以添加更多信息（f.e.a jsFiddle）。是從PHP，ASP或其他？桌子總是隻有一個入口嗎？年齡如何改變？ – Martin

我認爲你可以這樣做：jsFiddle

HTML：

<table> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>Age</th> 
      <th>Address</th> 
      <th>Button</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td>Mr.XX</td> 
      <td> 
       <input id="ageInput" type="text" value="20" /> 
      </td> 
      <td>Street XX</td> 
      <td><a name="sendName" id="sendId" href="#">Clik Here</a> 
      </td> 
     </tr> 
    </tbody> 
</table>

JS：

$(document).ready(function() { 
    $('#ageInput').keyup(function (e) { 
     var age = $(this).val(); 
     if (age != 20) { 
      // anything what should happend if its not 20 f.e.: 
      $('#sendId').hide(); 
     } else { 
      // anything what should happend if it is 20 f.e.: 
      $('#sendId').show(); 
     } 
    }); 
});

來源

2013-08-29 13:58:40 Martin

如果你認爲你必須** downvote **這將是很好** **發表評論**。 – Martin

我沒有想法爲什麼人們downvote這個答案。這幾乎是我想要的。感謝幫助:) – art

沒問題。你問你得到你需要的答案 - >我想要的一切;） – Martin

在鏈接的單擊處理程序中，獲取年齡值，執行測試並簡單地從處理程序返回false，如果您不希望它執行任何操作（即！== 20），則返回true以持久化數據...

來源

2013-08-29 13:46:09 LDJ

嘗試可能是這樣的： -

function disableLink() 
    { 
    if(document.getElementById(".age").innerHTML != 20) 
    { 
    document.getElementById('YourLink').disabled=true; 
    document.getElementById('YourLink').removeAttribute('href');  
    document.getElementById('YourLink').style.textDecoration = 'none'; 
    document.getElementById('YourLink').style.cursor = 'default'; 
    } 
    }

來源

2013-08-29 13:46:35

爲什麼downvote ?????? –

沒有downvote，但一般來說使用內聯JS是可怕的做法。 – PeeHaa

@PeeHaa： - 確定了你的觀點。用另一個選項更新我的答案！這看起來不錯嗎:) ?? –

添加onclick="return false;"

<a name=sendName id=sendId href="#" onclick="return false;" >Clik Here</a>

來源

2013-08-29 13:46:44

如果數據格式我將會保持一致，您應該將id屬性添加到將顯示數據的表格單元格中。這樣JavaScript可以使用該方法訪問它.getElementById()

來源

2013-08-29 13:46:53 djiango

是.that實際上我是做什麼的，但我沒有想在這裏顯示代碼，因爲它太長了。所以我只是做一個簡單而容易的解釋:) – art

-1

讓它將href更改爲javascript: void(0)如果值是不是20

的jsfiddle位置：http://jsfiddle.net/NBuxW/

使用jQuery：

if($(".age").text() != 20) { 
    $('.my-link').attr("href", "javascript: void(0)"); 
}

使用Javascript：

if(document.getElementById(".age").innerHTML != 20) { 
    document.getElementById(".age").href = "javascript: void(0)" 
}

來源

2013-08-29 13:50:13

負面投票的第二個原因是什麼？ –

我討厭它，當人們downvote無故解釋一個有效的答案，幸運的人upvoted到0 :( –

爲什麼不使用JQuery？

$("#sendId").on("click", function(){ 
    if ($("#age").text() != 20) { 
     return false; 
    } 
});

JsFiddle

來源

2013-08-29 13:56:38 kgd

您可以嘗試HTML5驗證：

<form> 
    Mr.XX 
    <input id="ageInput" type="number" value="20" min="20" max="20" /> 
    Street XX 
    <input type="submit" name="sendName" id="sendId" value="Clik Here" /> 
</form>

如果年齡不是一個數字，或者如果它大於20小於20，或更大，形式將是無效的，瀏覽器將不發送。

Demo

來源

2014-07-12 19:16:09 Oriol

使用javascript禁用HTML的href值

回答

相關問題