如何在上一個Web表單輸入數據後顯示Web表單？

我期待在第一個Web表單輸入內容後出現第二個Web表單。我目前正在使用一個設置爲slim的sinatra作爲模板引擎，以及純javascript。如何在上一個Web表單輸入數據後顯示Web表單？

input#topic value="Enter topic" onfocus="this.value = this.value=='Enter topic'?'':this.value;" onblur="this.value = this.value==''?'Enter topic':this.value;" 

input#subtopic value="Enter subtopic" onfocus="this.value = this.value=='Enter subtopic?'':this.value;" onblur="this.value = this.value==''?'Enter subtopic':this.value;"

以上是我的兩種形式，onfocus和onblur是使表單值消失並重新出現，如果點擊。

我的javascript如下。

function checkField(field) { 
    if(field.value != null) { 
     document.getElementById('subtopic_form').style.display = 'true'; 
    } else { 
     document.getElementById('subtopic_form').style.display = 'false'; 
    } 
}

這不工作，問題的一部分是，當我添加到輸入標籤

onchange="checkField(this)"

然後我得到一個功能未使用的消息我的JavaScript文件中，即使我有在我的home.slim文件中指定

script src="/js/application.js"

任何幫助得到這個工作，因爲我需要非常感謝。我打算爲此使用jquery，並且如果有任何方法可以使第二個窗體對外觀產生影響，那將會非常棒。

-Adam

來源

2013-08-19 Adam Bronfin

display屬性接受多個值，但true和false不在其中。要獲得完整列表，請轉至MDN或w3schools或MSDN。但我可以告訴你，現在，你很可能希望值是「無」和「塊」，如：

function checkField(field) { 
    if(field.value != null && field.value != '') { 
     document.getElementById('subtopic_form').style.display = 'block'; 
    } else { 
     document.getElementById('subtopic_form').style.display = 'none'; 
    } 
}

與jQuery，雖然，這個代碼可能是相當多的清潔劑！

function checkField(field) { 
    if (field.value != null && field.value != '') { 
     $("#subtopic_form").show(); 
    } else { 
     $("#subtopic_form").hide(); 
    } 
}

甚至

$("#topic").change(function(){ 
    if ($(this).val()) { 
     $("#subtopic_form").show(); 
    } else { 
     $("#subtopic_form").hide(); 
    } 
});

，如果你想要的效果，考慮jQuery的.fadeOut()或.slideUp()到位.hide（）

請注意，我說的field.value！= ''，以你的代碼。此外，最好使用！==而不是！=。

來源

2013-09-06 02:24:23

如何在上一個Web表單輸入數據後顯示Web表單？

回答

相關問題