这些可见性设置适用于除Safari之外的所有浏览器。我正在迷失方向试图找出原因。 JS脚本位于html部分。我知道代码通过“ if(pass == true){”部分获取,因为添加时会弹出javascript警报通知。虽然它似乎完全忽略了可见性设置。
请帮助!哈哈
更新:它开始看起来像是php信息处理我的表单的方式存在问题。如果在上传文件时单击“提交”后单击“停止”,则可见性设置将生效。其他所有浏览器似乎在进行文件上传之前都会更新可见性设置。 Safari为什么要先等待文件完成上传?
编辑:添加了完整的javascript,所以您可以看到我的文件上传检查
编辑:添加了我的窗体和php检查信息,以查看窗体如何接收此脚本
HTML / PHP
<?php
if (isset($_POST['submitted'])) {
$currentband = $_POST['band'];
$currentband = strtolower($currentband);
$pass = true;
$handle = fopen("submissions.oi","r");
$line = fgets($handle); $line = fgets($handle);
$line = trim($line);
$oldband = strtolower($line);
$x = 1;
if ($oldband == $currentband) { $pass = false; }
while ($line != '') {
for ($i = 0; $i <= 5; $i++) {
$line = fgets($handle);
}
$line = trim($line);
$oldband = strtolower($line);
if ($oldband == $currentband) { $pass = false; }
$x += 1;
}
if ($pass == true) { echo '<div id="thumbsup"> </div>'; }
else if ($pass == false) { echo '<div id="sadface"> </div>'; }
}
else { echo '<div id="upload"> </div>'; }
?>
<h2 style="font-style:italic;">Submit your music</h2>
<h3><p><font size="4">If you're ready to get involved in a fresh new approach to music distribution, we encourage you to upload one of your songs.<br>As one of our select few guests, we guarantee that your single will be broadcast during the first round of voting.<br>That's right! YOU will definitely be heard in the very first round of broadcasting, no matter what.</font></p>
<font size="2">
<?php
if (isset($_POST['submitted'])) {
if ($pass == true) {
$filename = ''.time().stripslashes($_FILES['datafile']['name']);
if ($_POST['testing'] == '') { $testing = 'No';}
else if ($_POST['testing'] == 'Yes') { $testing = 'Yes';}
$file = fopen("submissions.oi","a");
fwrite($file, $_POST['email'] . "\n" . $_POST['band'] . "\n" . $_POST['song'] . "\n" . $filename . "\n" . $testing . "\n" ."\n");
fclose($file);
$target_path = "submissions/";
$target_path = $target_path . basename( $filename);
move_uploaded_file(stripslashes($_FILES['datafile']['tmp_name']), $target_path);
if ($testing == 'Yes') { $testmsg = 'want'; }
else if ($testing == 'No') { $testmsg = 'NOT want'; }
$to = "[email protected]";
$from = $_POST['email'];
$band_name = stripslashes($_POST['band']);
$song_name = stripslashes($_POST['song']);
$subject = "A new song submission has been received!";
$message = "\"" . $band_name . "\" has submitted their song \"" . $song_name . "\" and does " . $testmsg . " to be included in future testing." . "\n \n" . "This is submission #: " . $x . "\n" . "File name: " . $filename;
$headers = "From: " . $from;
mail($to,$subject,$message,$headers);
$to = $_POST['email'];
$from = "[email protected]";
$subject = "Thank you for submitting your song to OUR INDUSTRY";
$message = "<p>Dear \"" . $band_name . "\",</p><p>Thank you for submitting your song \"" . $song_name . "\".<br>By doing so you have secured yourself a position in the upcoming voting round.<br>We will be in touch soon when the next alpha phase begins.<br>Please add this e-mail address to your whitelist.</p><p><a href='http://www.ourindustry.net/'>www.ourindustry.net</a></p>";
$headers = "From: " . $from . "\r\n";
$headers .= 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
mail($to,$subject,$message,$headers);
echo '<script>document.getElementById(\'patience\').style.visibility=\'hidden\';</script><center><div id="thumbsup-dim" style="right: 0; left:0;"></div><br><br><table style="width: 700px; height:220px;" cellpadding="2"><tbody><tr><td><h4 style="font-style:italic; font-size:28px;">Your upload was successful!<br></h4><h4 style="font-style:italic; font-size:20px;">We will be in touch as soon<br>as the voting round begins.</h4></td></tr></tbody></table></center></font>';
}
else if ($pass == false) {
echo '<script>document.getElementById(\'patience\').style.visibility=\'hidden\';</script><center><div id="sadface-dim" style="right: 0; left:0;"></div><br><br><table style="width: 700px; height:220px;" cellpadding="2"><tbody><tr><td><h4 style="font-style:italic; font-size:28px;">Sorry!<br></h4><h4 style="font-style:italic; font-size:20px;">We are currently receiving only one single per band.<br></h4><h4 style="font-style:italic; font-size:14px;">E-mail us to make arrangements if another band has uploaded using your band name.</h4></td></tr></tbody></table></center></font>';
}
}
else {
echo '
<form name="myForm" action="index.php#slide7" enctype="multipart/form-data" method="post" class="upload-form">
<center>
<br><br>
<table style="width: 500px; height:220px;" cellpadding="2">
<tbody>
<tr>
<td colspan="2" style="width:100%; height: 40px;"><font size="4" style="text-decoration:underline"><center>Here\'s how to get started<br></center></font></td>
</tr>
<tr>
<td style="width:60%">E-mail address:</td> <td><input type="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,63}$" class="ss-item-required" name="email" size="30" required></td>
</tr>
<tr>
<td>Band Name:</td> <td><input type="text" class="ss-item-required" name="band" size="30" required></td>
</tr>
<tr>
<td>Song Name:</td> <td><input type="text" class="ss-item-required" name="song" size="30" required></td>
</tr>
<tr>
<td>Select a MP3 file for upload (15mb max):</td><td><input class="upload-file" data-max-size="15728640" type="file" id="fUpload" name="datafile" size="40" accept=".mp3" onchange="checkextension()" style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 200px;" required></td>
</tr>
<tr>
<td>Check the box to be included in future testing</td><td><input type="checkbox" name="testing" value="Yes"></td>
</tr>
<tr>
<td align="center">
<input type="hidden" name="submitted" value="true">
</td>
<td>
<div><input style="visibility:visible;" type="submit" value="Send" id="i_submit" onclick="formcheck();"></div>
</td>
</tr>
</tbody>
</table>
</center>
</form>
<div style="position: absolute; left: 579px; bottom: 57px">
<div style="position: relative; left: 12px;" class="fb-like" data-href="https://www.facebook.com/ourindustry.net" data-layout="button" data-action="like" data-size="large" data-show-faces="true" data-share="true"></div><br>
<div style="position: relative; bottom: -7px">Like/Share Our Facebook Page</div>
</div>
</font>';}?>
<div id="reel" style="visibility:hidden;"></div>
<div id="patience" style="visibility:hidden;"><h4 style="font-style:italic; font-size:20px;">... UPLOADING ...</h4><br><h4 style="font-style:italic; font-size:14px;">Please be patient</h4></div>
JS
<script>
$(document).ready(function() {
$('a[href*=#]').each(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname && this.hash.replace(/#/,'') ) {
var $targetId = $(this.hash), $targetAnchor = $('[name=' + this.hash.slice(1) +']');
var $target = $targetId.length ? $targetId : $targetAnchor.length ? $targetAnchor : false;
if ($target) {
var targetOffset = $target.offset().top;
$(this).click(function() {
$("#nav li a").removeClass("active");
$(this).addClass('active');
$('html, body').animate({scrollTop: targetOffset}, 600);
return false;
});
}
}
});
});
function checkextension() {
var file = document.querySelector("#fUpload");
if ( /\.(mp3)$/i.test(file.files[0].name) === false ) {
alert("Sorry, this is not an mp3 file.\nTry again.");
document.getElementById("fUpload").value = "";
}
}
$(function(){
var fileInput = $('.upload-file');
var maxSize = fileInput.data('max-size');
$('.upload-form').submit(function(e) {
if(fileInput.get(0).files.length) {
var fileSize = fileInput.get(0).files[0].size; // in bytes
if(fileSize>maxSize) {
alert('File size is more then ' + maxSize + ' bytes.\nPlease upload a smaller mp3.');
return false;
}
}
});
});
function formcheck() {
var fileInput = $('.upload-file');
var maxSize = fileInput.data('max-size');
var pass = true;
var emailFilter = /[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,63}$/;
var email = document.forms["myForm"]["email"].value;
if (!emailFilter.test(email)) { pass = false; }
if (document.forms["myForm"]["email"].value == "") { pass = false; }
if (document.forms["myForm"]["band"].value == "") { pass = false; }
if (document.forms["myForm"]["song"].value == "") { pass = false; }
if (document.forms["myForm"]["datafile"].value == "") { pass = false; }
if (fileInput.get(0).files.length) {
var fileSize = fileInput.get(0).files[0].size; // in bytes
if(fileSize>maxSize) { pass = false; }
}
if (pass == true) {
document.getElementById('i_submit').style.visibility='hidden';
document.getElementById('reel').style.visibility='visible';
document.getElementById('patience').style.visibility='visible';
console.log(document.getElementById('i_submit'));
}
}
</script>
最佳答案
我只是在Safari中尝试过,它似乎可以工作。也许简化事情直到它们开始起作用?
function formcheck() {
var pass = true;
if (pass == true) {
document.getElementById('i_submit').style.visibility = 'hidden';
document.getElementById('patience').style.visibility = 'visible';
}
}
<div>
<input style="visibility:visible;" type="submit" value="Send" id="i_submit" onclick="formcheck();">
</div>
<div id="patience" style="visibility:hidden;">
<h4 style="font-style:italic; font-size:20px;">
... UPLOADING ...
</h4><br>
<h4 style="font-style:italic; font-size:14px;">
Please be patient
</h4>
</div>