jquery水平タイムバーで可変秒数の後にページを送信する

Question

50の質問を含むオンライン言語テストを提供しています。それぞれの質問には、最大の持続時間が秒単位で表示されます。各質問の秒数は、dbaseの変数です。たとえば、5つのチェックボックスを含む質問1の変数「秒」が60で、3つをチェックする必要があるとします。これは、参加者が3つの正しいチェックボックスをチェックするのに60秒かかることを意味します。 参加者が "時間内に正しい"ボックスをチェックすると、Submitをクリックします。 ユーザーが60秒以内に応答しない場合、ページは自動的に提出されます（すべてのチェックボックスをオンにしていなくても）。 テストウィンドウの左上隅には、水平タイムバーの移動が候補として表示されます。秒数は表示されませんが、期限が切れそうになった時点で、候補者は非常にはっきりと確認できます。

この手順は、javascript（下記参照）を使用して4年間問題なく動作しています。ただし、すべてのブラウザで動作するわけではありません。 Firefoxはそれを認識せず、その結果Firefoxのユーザーは世界中のあらゆる時間を使って回答を完了したり研究したりしています:-) これまで、「申し訳ありませんが、私たちのシステムはインターネットエクスプローラのみ "、それはそれでした。結局のところ、すべてのブラウザの95％はとにかくIEでした。しかし、今私はユーザー統計を見直しました。私の場合、全パートパントの67％だけがまだIEを使用しています。 それで、私は現在、JavaScriptを「ページ内」から「JQUERY」に変更する方法を探しています。私は数週間前にJQUERYを見つけました（私はプログラマーではありません）。私はJQUERYを数多く使ってきましたが、それは魅力的なものです。さらに、JQUERYはすべてのブラウザで動作するように思われます。

しかし、私はそのトリックを行うことができる正しいJQUERYコードを見つけられないようです。

<!-- 
#bar, #barbackground 
{ 
position:absolute; 
left:0; 
top:0; 
background-color:#FFFFFF; 
} 

#barbackground{ 
background-color:#c0c0c0; 
} 
--> 
</style> 
<CFOUTPUT> 

<CFIF #selectvragen.Vragen_seconds# EQ 0><CFSET seconden=60><CFELSE><CFSET seconden=#selectvragen.Vragen_seconds#+2></CFIF> 
<script language="JavaScript1.2"> 
//1) Set the duration for the progress bar to complete loading (in seconds) 
var duration=#seconden# 
function postaction(){ 
    document.forms.formulier.submit() 
//Example action could be to navigate to a URL, like following: 
//window.location="submit.cfm?scoreperpage=#scoreperpage#&subcatID=#selectvragen.Vragen_subcatID#&level=#selectvragen.Vragen_level#&maxpunten=#maxpunten#&maxtebehalenpunten=#selectvragen.Vragen_maxpunten#&vnr=#vnr#&Tabel=too_late&optie=1&score=#score#&teller=#teller#&nieuwelijst=#nieuwelijst#&starttijdQuestion=#CreateODBCDateTime(now())#" 

} 

///Done Editing///////////// 
var clipright=0 
var widthIE=0 
var widthNS=0 

function initializebar(){ 
if (document.all){ 
baranchor.style.visibility="visible" 
widthIE=bar.style.pixelWidth 
startIE=setInterval("increaseIE()",50) 
} 
if (document.layers){ 
widthNS=document.baranchorNS.document.barbackgroundNS.clip.width 
document.baranchorNS.document.barNS.clip.right=0 
document.baranchorNS.visibility="show" 

startNS=setInterval("increaseNS()",50) 
} 
} 

function increaseIE(){ 
bar.style.clip="rect(0 "+clipright+" auto 0)" 
window.status="Loading..." 
if (clipright<widthIE) 
clipright=clipright+(widthIE/(duration*20)) 
else{ 
window.status='' 
clearInterval(startIE) 
postaction() 
} 
} 

function increaseNS(){ 
if (clipright<202){ 
window.status="Loading..." 
document.baranchorNS.document.barNS.clip.right=clipright 
clipright=clipright+(widthNS/(duration*20)) 
} 
else{ 
window.status='' 
clearInterval(startNS) 
postaction() 
} 
} 
window.onload=initializebar 
</script> 

</CFOUTPUT> 
      <script language="JavaScript1.2"> 
      if (document.all){ 
      document.write('<div id="baranchor" style="position:relative;width:200px;height:10px;visibility:hidden;">') 
      document.write('<div id="barbackground" style="width:200px;height:10px;z-index:9"></div>') 
      document.write('<div id="bar" style="width:200px;height:10px;z-index:10"></div>') 
      document.write('</div>') 
      } 
      </script> 

を私は続行する方法がわからない、また私はこの質問が明確であるかどうかを確信している...私は可能性も：あなたの詳細については、私は現在、以下の使用しているコードを を添付しています必要に応じて、より良いビューを提供するために、テストのスクリーンショットを送信しますか？事前に

おかげで、

敬具、

トーマス（ベルギー）

Answer 1

あなたが与えている非常に素晴らしく、かなりの表現。

しかし、私もjQuery/javaScriptの初心者です。あなたのコードを完全に理解することはできません。しかし、私が見つけることができる1つのことは、使用することですjQuery Timer Plugin.

これはあなたの問題を完全に解決しないと確信しています。そして、私はまた、経験豊かな他の人たちからの正しい明確な助けを待っています。

ありがとうございます。

Answer 2

JQueryに.submit（）オプションがあります。

$("#formId").submit(); 

タイマーがゼロになったときに、リクエストしているものと似たものを探していました。それは働いているか私ですが、私はまだ多くのブラウザでそれを試していません。

タイマーが0になった後に提出するのが少し難しかったです。奇妙なことに、（下記）のdivと入力

<input type="submit" ... /> 

を提出してから言ってjQueryのコマンドを使用して「ユーザーがdiv要素をクリックすると、フォームを送信」交換することは大丈夫動作させるように見えました。

$("#divIdToSubmit").click(function(){ 
    $("#formId").submit(); 
}); 

私はまだJQueryで緑色なので、壊れたコードを修正する良い方法があると確信しています。