在随机编号窗体上显示除零以外的内容

On a random no. form displays except zero

本文关键字：编号 随机 窗体 显示      更新时间：2024-04-23

如果随机数不是零到15之间，我想显示一个窗体。这是我试过的一个代码。我用过iframe，但我想要其他方法。在booking.html中有一个简单的表单。我希望它没有iframe如何做。

function myFunction(){
    var x=document.createElement("IFRAME"); 
    x.setAttribute("src","booking.html"); 
    x.style.height="700px"; 
    x.style.border="none"; 
    x.style.float="center"; 
    document.getElementById("ran").appendChild(x); 
} 
var z=Math.floor(Math.random()*15); 
if(z==0){ 
    document.getElementById("ran").innerHTML=
        "sorry no seats available </br> Please select another date to book ticket"; 
}else{ 
    document.getElementById("ran").innerHTML=
        "HURRY UP "+z+" seats available !!!</br></br>"; 
    window.onload=myFunction; 
}

当您用jQuery标记问题时，您可以从load方法中受益：

在HTML中定义两个区域：一个用于消息，一个用于预订页面：

<div id="ran">
    <div id="msg" style="white-space: pre"></div>
    <div id="load"></div>
</div>

white-space: pre只是为了方便文本中的换行，而不必使用HTML编码。

在Javascript中：

$(function() {
    var z = Math.floor(Math.random()*15); 
    if (!z) {
        // Preferably don't use html(), but text(): 
        $("#msg").text("Sorry, no seats available.'nPlease select another date to book ticket");
    } else {
        $("#msg").text("HURRY UP, " + z + " seats available !!!"); 
        // Here comes the magic of jQuery which does all the Ajax stuff:
        $("#load").load('booking.html');
    }
});

然而，如果预订页面属于您的网站，为什么不将这些页面合并为一个呢？您可以包含它，但使用style="display:none"隐藏它。

<div id="ran">
    <div id="msg" style="white-space: pre"></div>
    <div id="booking" style="display:none"> <!-- hide initially -->
         <!--- just example code. Put your own stuff here --->
         <form action="book.php" method="POST">
             Date from: <input type="text" id="from"><br>
             Date until: <input type="text" id="until"><br>
             <!-- etcetera .... -->
         </form>
    </div>
</div>

然后在Javascript中，只有当有座位可用时才会显示：

$(function() {
    var z = Math.floor(Math.random()*15); 
    if (!z) {
        // Preferably don't use html(), but text(): 
        $("#msg").text("Sorry, no seats available.'nPlease select another date to book ticket");
    } else {
        $("#msg").text("HURRY UP, " + z + " seats available !!!"); 
        $("#booking").show(); // Only show form when there are seats available.
    }
});
相关文章：