啓用提交按鈕只有當有textarea的字符

我的工作有一個文本區域和一個提交按鈕基本形式：啓用提交按鈕只有當有textarea的字符

<form action="admin-post.php" method="post"> 

    <textarea style="width:630px;" aria-hidden="true" class="wp-editor-area" rows="6" autocomplete="off" cols="71" name="author_message" id="author_message"></textarea> 

    <p class="submit"> 
     <input type="submit" value="Post Message" class="button button-primary" id="submit" name="submit"> 
    </p> 

</form>

我想提交按鈕只啓用如果有一些在textarea中輸入的文本。我怎樣才能使用Javascript來做到這一點？

請注意，我無法更改提交按鈕的值或HTML代碼。

來源

2014-10-11 Henrik Petterson

如果你需要不斷驗證解決它像這樣（不更改按鈕屬性）：

<textarea style="width:630px;" aria-hidden="true" class="wp-editor-area" rows="6" autocomplete="off" cols="71" name="author_message" id="author_message" onkeyup="if(this.textLength != 0) {submit.disabled = false} else {submit.disabled = true}"></textarea>

和修改body標籤：

<body onload="submit.disabled = true">

乾杯

JSFiddle

編輯：

如果您不能修改body標籤，只需添加禁用屬性按鈕。

來源

2014-10-11 14:12:18 Flash1232

我無法完成這項工作。你能給我看一個使用JSFiddle的工作示例嗎？請注意，我無法調整頁面的主體標記，但是，我可以將「禁用」添加到提交按鈕，並且必須將所有Javascript都插入到body標記中。所以就在表單上方。 – 2014-10-11 14:29:03

我的代碼演示了一個解決方案，在身體標記中的JavaScript。（textarea「author_message」放在body部分）你是指body和form-tag之間的意思嗎？ – Flash1232 2014-10-11 14:37:11

工程很棒。我有一個最後的問題。瀏覽器兼容性如何？這會在大多數瀏覽器上運行嗎？ – 2014-10-11 14:37:49

在這裏工作代碼JSBIN :)我用HTMLDisable屬性

來源

2014-10-11 13:57:15 maq

正如我在我的問題中指出的，我無法更改提交按鈕的HTML。當這仍然有可能時，你有不同的方法嗎？ – 2014-10-11 14:01:37

你需要找到在DOM先提交按鈕，並禁用它，然後附加一個事件監聽器的textarea，其中禁用/啓用基於文本區域是否爲空或不提交按鈕：

document.getElementById("submit").disabled = true; 
document.getElementById("author_message").addEventListener('change', func, false); 

function func(){ 
document.getElementById("submit").disabled = (document.getElementById("author_message").value==='') ; 
}

這是JsFiddle。

來源

2014-10-11 14:12:26 dramzy

啓用提交按鈕只有當有textarea的字符

回答

相關問題