遺漏的類型錯誤：CONTENTEDITABLE不是一個函數

我試圖創建將啓用或禁用contenteditable但是對於所有<div>的我得到contentEditable不是功能的功能按鈕，任何人都知道爲什麼嗎？遺漏的類型錯誤：CONTENTEDITABLE不是一個函數

function contentEditable() { 
    var x = document.getElementsByClassName("editable"); 
    if ($(this).attr("contentEditable") == "true") { 
     console.log=(hello); 
     x.setAttribute('contentEditable', 'true'); 
     button.innerHTML = "Enable content of p to be editable!"; 
    } else { 
     x.setAttribute('contentEditable', 'false'); 
     button.innerHTML = "Disable content of p to be editable!"; 
    } 
}

<button onclick="contentEditable(this);" id="contentEdit" class="btn btn-primary form-control margin">Edit Text</button>

來源

2017-03-02 Przemek

您的腳本可能未運行，或者在contentEditable（）被定義之前失敗。我們需要一個http://jsfiddle.net/例子來看看到底發生了什麼。 – Cauterite

事實上，代碼的順序在這裏很重要。另外，getElementsByCLassName返回一個活動節點列表，因此您需要訪問第一個節點x [0]。 'console.log =（helllo）;'是一個錯字。 – Shilly

它可能是屬性'''contentEditable'''的初始值不是'''「true」'''但是''''繼承「'''？ – daniegarcia254

所以很多問題我只是發表一個註釋的例子。

<!DOCTYPE html> 
<html lang="en"> 
<head></head> 
<body> 
<!-- make sure contenteditable is set to false initially --> 
<div class="editable" contenteditable="false">some text 1</div> 
<div class="editable" contenteditable="false">some text 2</div> 
<div class="editable" contenteditable="false">some text 3</div> 
<button id="contentEdit" class="btn btn-primary form-control margin">Edit Text</button> 
<script> 
var button = document.querySelector('#contentEdit'); 
var contentEditable = function contentEditable() { 
    // getElementsByClassName returns a nodelist,so we ahve to cast it to an array, or use a basic for-loop. 
    var editables = Array.prototype.slice.call(document.getElementsByClassName("editable")); 
    editables.forEach(function(x) { 
     // We want to check the <div> tag for editable, not the button 
     // the correct attribute is lowercase contenteditable 
     if (x.getAttribute("contenteditable") === 'false') { 
      // fixed syntax 
      console.log("hello"); 
      x.setAttribute('contenteditable', 'true'); 
      // swicthed around Disable and Enable in the strings to make the logic correct. 
      button.innerHTML = "Disable content of p to be editable!"; 
     } else { 
      x.setAttribute('contenteditable', 'false'); 
      button.innerHTML = "Enable content of p to be editable!"; 
     } 
    }); 
}; 
button.addEventListener("click", contentEditable); 
</script> 
</body> 
</html>

來源

2017-03-02 14:22:16 Shilly

它的工作，但它正在改變contenteditable從「假」爲「真」只爲一個div，而我想它改變它的所有div＃content-link2 – Przemek

然後，你必須循環所有的divs對不起，因爲你沒有顯示任何循環，所以錯過了那個部分 – Shilly

這是因爲我沒有任何循環，你能更新一個答案來告訴我它是如何完成的嗎？當然， – Przemek

-2

你已經錯過傳遞參數到你的函數定義：

function contentEditable(obj) { 
    // replace all this with obj 
    var x = document.getElementsByClassName("editable"); 
    if ($(obj).attr("contentEditable") == "true") { 
     console.log=(hello); 
     x.setAttribute('contentEditable', 'true'); 
     button.innerHTML = "Enable content of p to be editable!"; 
    } else { 
     x.setAttribute('contentEditable', 'false'); 
     button.innerHTML = "Disable content of p to be editable!"; 
    } 
}

來源

2017-03-02 14:03:25

嘗試更改函數名稱，然後它將工作 –

你猜？ –

不，我已經嘗試過，然後錯誤更改爲'x.setAttribute'沒有定義，這意味着它進入功能和錯誤是因爲我沒有定義'x.setAttribute' –

使加載的頁面裏面肯定contentEditable功能和它不是任何其他函數中定義。嘗試從Chrome或Firebug控制檯執行contentEditable函數。

來源

2017-03-02 14:09:25

從您的代碼中有其他錯誤

除此之外，主要的問題是你的功能無法訪問。這裏的地方，我已經把contentEditable()在文檔中的小提琴，所以在按鍵<button onclick="document.contentEditable()">

document.contentEditable = function() { 
 
    var divs = $("div.editable"), 
 
    button = $("#btn"), 
 
    attr; 
 
    divs.each(function(index, item) { 
 
    attr = $(this).attr('contentEditable'); 
 
    $(this).attr('contentEditable', attr == 'true' ? 'false' : 'true'); 
 
    
 
    }); 
 
    button.html(attr == 'true' ? 'Disable' : 'Enable'); 
 
    //console.log(divs); 
 
}

div.editable { 
 
    width: 150px; 
 
    height: 50px; 
 
    margin: 10px; 
 
} 
 

 
[contentEditable="true"] { 
 
    background: black; 
 
} 
 

 
[contentEditable="false"] { 
 
    background: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div contentEditable="true" class="editable"></div> 
 
<div contentEditable="true" class="editable"></div> 
 
<div contentEditable="true" class="editable"></div> 
 
<div contentEditable="true" class="editable"></div> 
 
<div contentEditable="true" class="editable"></div> 
 

 
<button id="btn" onclick="document.contentEditable();">Disable</button>

使用它不過既然你已經在使用Jquery的，爲什麼不使用類似：

$(":button")//you can use any selector for your button, id perhaps? 
.on('click', function() { //your code... });

來源

2017-03-02 14:56:05

遺漏的類型錯誤：CONTENTEDITABLE不是一個函數

回答

相關問題