Использование кнопок в JavaScript

Как создать кнопку, чтобы всякий раз, когда вы нажимаете на нее, вопрос меняется на ее верхний регистр, а затем, когда вы нажимаете кнопку снова, она изменяется на ее строчную форму. Я считаю, что я должен создать какую-то функцию, просто не уверен, как это сделать. Ниже то, что я пытался до сих пор:Использование кнопок в JavaScript

function upper_lower() { 
    if (windows.document.f1.value=="lower") { 
    windows.document.value = "UPPER" 
    windows.document.question = windows.document.question.toUpperCase(); 
    windows.document.queston.size="40" 
    } else { 
    windows.document.value = "lower" 
    windows.document.question = windows.document.question.toLowerCase() 
    windows.document.queston.size="30" 
    } 
}

Вопрос

<input type="text" name="question" value="Favorite food?" size="25">

чтения/вход

<input type="button" name="f1" value="UPPER" onClick = "upper_lower">

источник

2015-02-13 user3386103

особенность использования тумблер путем добавления некоторого флага и преобразования 'string.toUpper Case() 'или' lowerCase() 'base of flag –

Правильно ли указан HTML-код? Кажется, что вам не хватает скобок '< >'. –

Вы правы; в нем отсутствуют некоторые скобки! Сожалею! Новичок для JavaScript; только начал учиться на прошлой неделе. – user3386103

Попробуйте

Html:

Question <input type="text" name="question" id="question1" value="Favorite food?" size="25" readonly></input> 
<input type="button" name="f1" id="button1" value="UPPER" onClick="upper_lower()"></input>

ЯШ:

var toggle = true; 
function upper_lower(){ 
    var question = document.getElementById('question1'), 
     button = document.getElementById('button1'); 
    if(toggle){ 
     question.value = question.value.toUpperCase(); 
     button.value = 'LOWER'; 
     toggle = false; 
    } else{ 
     question.value = question.value.toLowerCase(); 
     button.value = 'UPPER'; 
     toggle = true; 
    } 
}

сниппетов ниже (с отступом странно по какой-то причине)

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
\t <meta charset="UTF-8" /> 
 
\t <title>Document</title> 
 
</head> 
 
<body> 
 
\t Question <input type="text" name="question" id="question1" value="Favorite food?" size="25" readonly></input> 
 
\t <input type="button" name="f1" id="button1" value="UPPER" onClick="upper_lower()"></input> 
 
</body> 
 

 
<script> 
 
var toggle = true; 
 
function upper_lower(){ 
 
\t var question = document.getElementById('question1'), 
 
\t \t button = document.getElementById('button1'); 
 
\t if(toggle){ 
 
\t \t question.value = question.value.toUpperCase(); 
 
\t \t button.value = 'LOWER'; 
 
\t \t toggle = false; \t 
 
\t } else{ 
 
\t \t question.value = question.value.toLowerCase(); 
 
\t \t button.value = 'UPPER'; 
 
\t \t toggle = true; 
 
\t } 
 
} 
 

 
</script> 
 
</html>

источник

2015-02-13 03:57:50 strix

Попробуйте этот обновленный код ...

<script type="text/javascript"> 
    var flag = 0; 
    function changecase() {  

     if (flag == 0) { 

      document.form1.instring.value = document.form1.instring.value.toUpperCase(); 
      document.form1.Convert.value = 'To Lower' 
      flag = 1; 
     } 
     else 
     { 

      document.form1.instring.value = document.form1.instring.value.toLowerCase(); 
      document.form1.Convert.value = 'To Upper' 
      flag = 0; 
     } 


    } 
</script> 



     <form name="form1" method="post"> 
     <input name="instring" type="text" value="this is the text string" size="30"> 
     <input type="button" name="Convert" value="To Upper " onclick="changecase();"> 

     </form>

источник

2015-02-13 04:11:08 user3921547

Не создает ли это новое поле, которое выводит измененный код? Я надеялся просто переключить корпус в оригинальной коробке, а не создавать новую. – user3386103

Я обновил код, который вы можете проверить – user3921547

Использование кнопок в JavaScript

ответ

Смежные вопросы