Uncaught TypeError: String nie jest funkcją

Question

Jestem nowicjuszem w JavaScript i jako część mojego projektu na studia muszę dołączyć kilka. Stworzyłem prostą js plik i powiązane go do mojego pliku index.html używając <script src="main.js"></script>

I stworzył kolejną stronę o nazwie sellYourHome.html i dodał <section> tag ze stołem i stworzył prosty formularz, który oblicza prowizję i wyświetla wyniki z powrotem w polu wejściowym.

function comCalc() 
{ 
prcHouse = parseFloat(document.getElementById('prcHouse').value); 
commision = 0.25; 
result = prcHouse * commision; 
document.getElementById('prcHouse').value = result.toString(); 
} 

To zadziałało.

Teraz pod tą funkcją chciałem stworzyć kolejną, która odbiera element <div> i zmienia background-color na, powiedzmy, niebieski.

Tak więc utworzyłem formularz na index.html i połączyłem ten sam plik .js z nim w ten sam sposób.

To jest mój HTML:

<div id="mainContent"> 
    <p>hello</p> 
    <form id="bgColor"> 
     <table> 
      <tr> 
       <td> 
        <input type="button" value="blue" onclick="bgColor('blue');"> 
       </td> 
      </tr> 
     </table> 
    </form><!-- end of bgColor Form--> 
</div> 

Moja JavaScript jest tak:

function comCalc() 
{ 
    prcHouse = parseFloat(document.getElementById('prcHouse').value); 
    commision = 0.25; 
    result = prcHouse * commision; 
    document.getElementById('prcHouse').value = result.toString(); 
} 

function bgColor(color) 
{ 
    var div = document.getElementById('mainContent'); 
    div.style.background=color; 
} 

Kiedy uruchamiam to mam ten błąd na konsoli:

Uncaught TypeError: String is not a function

I używam tego w przeglądarce o nazwie SWRIron (która jest oparta na Chrome i zgodna z HTML5).

Co robię źle?

Answer 1

To z powodu swojej nazwy funkcji bgColor, ponieważ bgcolor jest atrybutem HTML elementu i to w zderzeniu ze swoimi funkcja bgcolor traktuje przeglądarek to jako attribute (string), ale używali go jako funkcja, więc to mówi string is not a function. Tak, zmienić nazwę funkcji do niczego innego jak tego

function setBgColor(color) 
{ 
    var div = document.getElementById('mainContent'); 
    div.style.background = color; 
} 

Użyj go jako

<input type="button" value="blue" onclick="setBgColor('blue');" /> 

Example.

Answer 2

Tak. Ponieważ bgColor jest systemem zarezerwowanym dla HMTL, generuje błąd o nazwie "Uncaught TypeError: String is not a function". jeśli zmienisz nazwę metody, będzie działała dobrze i działa dobrze.