エラー「Uncaught TypeError：未定義のプロパティ 'sdIntContent'を読み取ることができません」

ホームページのすべての内部ページで使用するダイアログボックスがありますが、ページ1のキックでエラーが発生するキャッチされない例外TypeErrorは言う：未定義の「sdIntContent」プロパティを読み取ることができませんとダイアログボックスがあなたがあなたのコードでは、次のミスを持っているもうエラー「Uncaught TypeError：未定義のプロパティ 'sdIntContent'を読み取ることができません」

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="ISO-8859-1"> 
<title>Insert title here</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.js"></script> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css"> 
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script> 
<link rel="stylesheet" type="text/css" href="http://dev.jtsage.com/cdn/simpledialog/latest/jquery.mobile.simpledialog.min.css"> 
<script type="text/javascript" src="http://dev.jtsage.com/cdn/simpledialog/latest/jquery.mobile.simpledialog2.js"></script> 
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.css"> 
<script type="text/javascript">//<![CDATA[ 
$(document).on('pageinit', '#home', function(){ 
    $(document).on ('click','#firstbutton', function() {   
     $('#footerdialog').simpledialog2({themeDialog: 'c'}); 
    }); 
    $(document).on('click','#first',function() { 
     window.location.href = "#first"; 
     $('#footerdialog').simpledialog2('close'); 
    }); 
    $(document).on('click','#second',function() { 
     window.location.href = "#second"; 
     $('#footerdialog').simpledialog2('close'); 
    }); 
});//]]> 

</script> 
<!--script type="text/javascript">//<![CDATA[ 
$(document).on('pageinit', '#home', function(){ 
    $(document).on ('click','#secondbutton', function() {   
     $.mobile.changePage('#secondpage', { 
      transition: 'slideup', 
      changeHash: true, 
      role: 'dialog' 
     }); 
    }); 

    $(document).on('click','#third',function() { 
     window.location.href = "#third"; 
    }); 
    $(document).on('click','#fourth',function() { 
     window.location.href = "#fourth"; 
    }); 
});//]]> 

</script--> 
</head> 
<body> 
<div data-role="page" id="home"> 
    <div data-role="footer" data-position="fixed" class="ui-footer ui-bar-a ui-footer-fixed slideup" data-theme="c"> 
     <div data-role="navbar" data-theme="c"> 
      <ul> 
       <li>  
        <button id="firstbutton" data-rel="dialog" data-corners="false" data-theme="c">first button</button> 
       </li> 
       <li> 
        <button id="secondbutton" data-rel="dialog" data-corners="false" data-theme="c">second button</button> 
       </li> 
      </ul> 
     </div> 
    </div> 
</div> 

     <div data-role="dialog" id="firstpage" data-theme="a" data-corners="false" class="ui-dialog my-dialog ui-dialog-contain"> 
      <div data-role="content"> 
       <a href="#" id="first" data-role="button" data-icon="false" style="color: white; background:red;">first</a> 
       <a href="#" id="second" data-role="button" data-icon="false" style="color: white; background:red;">second</a> 

      </div> 
     </div> 
     <div data-role="dialog" id="secondpage" data-theme="a" > 
      <div data-role="content"> 
       <a href="#" id="third" data-role="button" data-icon="false" style="color: White; background:green;">third</a> 
       <a href="#" id="fourth" data-role="button" data-icon="false" style="color: White; background:green;">fourth</a> 

      </div> 
     </div> 
    <div id="footerdialog" style="display:none" data-options='{"mode":"blank","headerText":"Dialog","headerClose":false,"blankContent":true}'> 
    <div style="padding: 15px;">  
     <ul> 
      <li> 
       <button id="first" data-corners="false" data-theme="c">first button</button>  
      </li> 
      <li>  
       <button id="second" data-corners="false" data-theme="c">second button</button> 
      </li> 
      <li> 
       <button id="third" data-corners="false" data-theme="c">third button</button> 
      </li> 
     </ul>   
    </div> 
    </div>   

<div data-role="page" id="first" data-theme="c" data-transition="slideup"> 
    <div data-role="header" ></div> 
    <div data-role="content" style="text-align: center;" data-theme="c" data-inline="true"> 
     <div> 
      <input type="text" id="second" placeholder="first page"> 
     <div class="ui-grid-a"> 
      <div class="ui-block-a"> 
       <div data-role="fieldcontain" align="right"> 
       <a style="width:25%" data-role="button" id="first" href="#">first</a> 
       </div> 
      </div> 
      <div class="ui-block-b"> 
       <div data-role="fieldcontain" align="left"> 
       <a style="width:25%" data-role="button" id="esecond" href="#">second</a> 
       </div> 
      </div> 
     </div> 
      <div class="ui-grid-c"> 
       <div class="ui-block-a"> 
        <a href="#" data-role="button" data-icon="false" style="color: White; background:green;">first</a> 
       </div> 
       <div class="ui-block-b"> 
        <a href="#" data-role="button" data-icon="false" style="color: Black; background:yellow;">second</a> 
       </div> 
       <div class="ui-block-c"> 
        <a href="#" data-role="button" data-icon="false" style="color: white; background:black;">third</a> 
       </div> 
       <div class="ui-block-d"> 
        <a href="#" data-role="button" data-icon="false" style="color: White; background:red;">fourth</a> 
       </div> 
      </div> 
     </div> 


<div data-role="content" id="home"> 
    <div data-role="footer" data-position="fixed" class="ui-footer ui-bar-a ui-footer-fixed slideup" data-theme="c"> 
     <div data-role="navbar" data-theme="c"> 
      <ul> 
       <li>  
<button id="firstbutton" data-corners="false" data-theme="c">first button</button> 
       </li> 
       <li> 
<button id="secondbutton" data-corners="false" data-theme="c">second button</button> 
       </li> 
      </ul> 
     </div> 
    </div> 
</div> 
    </div>  
</div> 
<div data-role="page" id="second" data-theme="c" data-transition="slideup"> 
    <div data-role="header" ></div> 
    <div data-role="content" style="text-align: center;" data-theme="c" data-inline="true"> 
     <div> 
      <input type="text" id="second" placeholder="Second Page"> 
     <div class="ui-grid-a"> 
      <div class="ui-block-a"> 
       <div data-role="fieldcontain" align="right"> 
       <a style="width:25%" data-role="button" id="first" href="#">first</a> 
       </div> 
      </div> 
      <div class="ui-block-b"> 
       <div data-role="fieldcontain" align="left"> 
       <a style="width:25%" data-role="button" id="esecond" href="#">second</a> 
       </div> 
      </div> 
     </div> 
      <div class="ui-grid-c"> 
       <div class="ui-block-a"> 
        <a href="#" data-role="button" data-icon="false" style="color: White; background:green;">first</a> 
       </div> 
       <div class="ui-block-b"> 
        <a href="#" data-role="button" data-icon="false" style="color: Black; background:yellow;">second</a> 
       </div> 
       <div class="ui-block-c"> 
        <a href="#" data-role="button" data-icon="false" style="color: white; background:black;">third</a> 
       </div> 
       <div class="ui-block-d"> 
        <a href="#" data-role="button" data-icon="false" style="color: White; background:red;">fourth</a> 
       </div> 
      </div> 
     </div> 


<div data-role="content" id="home"> 
    <div data-role="footer" data-position="fixed" class="ui-footer ui-bar-a ui-footer-fixed slideup" data-theme="c"> 
     <div data-role="navbar" data-theme="c"> 
      <ul> 
       <li>  
<button id="firstbutton" data-corners="false" data-theme="c">first button</button> 
       </li> 
       <li> 
<button id="secondbutton" data-corners="false" data-theme="c">second button</button> 
       </li> 
      </ul> 
     </div> 
    </div> 
</div> 
    </div>  
</div> 
<div data-role="page" id="third" data-theme="c" data-transition="slideup"> 
    <div data-role="content" style="text-align: center;" data-theme="c" data-inline="true"> 
     <div> 
      <input type="text" id="second" placeholder="third page"> 
     <div class="ui-grid-a"> 
      <div class="ui-block-a"> 
       <div data-role="fieldcontain" align="right"> 
       <a style="width:25%" data-role="button" id="first" href="#">first</a> 
       </div> 
      </div> 
      <div class="ui-block-b"> 
       <div data-role="fieldcontain" align="left"> 
       <a style="width:25%" data-role="button" id="esecond" href="#">second</a> 
       </div> 
      </div> 
     </div> 
      <div class="ui-grid-c"> 
       <div class="ui-block-a"> 
        <a href="#" data-role="button" data-icon="false" style="color: White; background:green;">first</a> 
       </div> 
       <div class="ui-block-b"> 
        <a href="#" data-role="button" data-icon="false" style="color: Black; background:yellow;">second</a> 
       </div> 
       <div class="ui-block-c"> 
        <a href="#" data-role="button" data-icon="false" style="color: white; background:black;">third</a> 
       </div> 
       <div class="ui-block-d"> 
        <a href="#" data-role="button" data-icon="false" style="color: White; background:red;">fourth</a> 
       </div> 
      </div> 
     </div> 
<div data-role="content" id="home"> 
    <div data-role="footer" data-position="fixed" class="ui-footer ui-bar-a ui-footer-fixed slideup" data-theme="c"> 
     <div data-role="navbar" data-theme="c"> 
      <ul> 
       <li>  
<button id="firstbutton" data-corners="false" data-theme="c">first button</button> 
       </li> 
       <li> 
<button id="secondbutton" data-corners="false" data-theme="c">second button</button> 
       </li> 
      </ul> 
     </div> 
    </div> 
</div> 
    </div>  
</div> 
<div data-role="page" id="fourth" data-theme="c" data-transition="slideup"> 
    <div data-role="content" style="text-align: center;" data-theme="c" data-inline="true"> 
     <div> 
      <input type="text" id="second" placeholder="fourth page"> 
     <div class="ui-grid-a"> 
      <div class="ui-block-a"> 
       <div data-role="fieldcontain" align="right"> 
       <a style="width:25%" data-role="button" id="first" href="#">first</a> 
       </div> 
      </div> 
      <div class="ui-block-b"> 
       <div data-role="fieldcontain" align="left"> 
       <a style="width:25%" data-role="button" id="esecond" href="#">second</a> 
       </div> 
      </div> 
     </div> 
      <div class="ui-grid-c"> 
       <div class="ui-block-a"> 
        <a href="#" data-role="button" data-icon="false" style="color: White; background:green;">first</a> 
       </div> 
       <div class="ui-block-b"> 
        <a href="#" data-role="button" data-icon="false" style="color: Black; background:yellow;">second</a> 
       </div> 
       <div class="ui-block-c"> 
        <a href="#" data-role="button" data-icon="false" style="color: white; background:black;">third</a> 
       </div> 
       <div class="ui-block-d"> 
        <a href="#" data-role="button" data-icon="false" style="color: White; background:red;">fourth</a> 
       </div> 
      </div> 
     </div> 
<div data-role="content" id="home"> 
    <div data-role="footer" data-position="fixed" class="ui-footer ui-bar-a ui-footer-fixed slideup" data-theme="c"> 
     <div data-role="navbar" data-theme="c"> 
      <ul> 
       <li>  
<button id="firstbutton" data-corners="false" data-theme="c">first button</button> 
       </li> 
       <li> 
<button id="secondbutton" data-corners="false" data-theme="c">second button</button> 
       </li> 
      </ul> 
     </div> 
    </div> 
</div> 
    </div>  
</div> 
</body> 
</html>

出典

2013-10-29 Anonymous

それは、サードパーティのライブラリの問題（simpledialog2）です。 – Omar

はいiveそれに見えたが、私はそれを修正する方法やそれをwork.anyアイデアにするために何をすべきかわからないのですか？ –

なぜjQMダイアログを使用しないのですか？ – Omar

表示されません。

あなたのナビゲーションバーにbutton代わりaのタグを使用しています。

<div data-role="navbar" data-theme="c"> 
    <ul> 
    <li> 
     <a href="#firstpage" data-rel="dialog" data-corners="false" data-theme="c">first button</a> 
    </li> 
    <li> 
     <a href="#secondpage" data-rel="dialog" data-corners="false" data-theme="c">second button</a> 
    </li> 
    </ul> 
</div>

あなたはいくつかの要素に同じidを与えている、id s'はユニークである必要があり、次のように正しい構文は次のとおりです。

Demo

出典

2013-10-29 10:16:04 Omar

エラー「Uncaught TypeError：未定義のプロパティ 'sdIntContent'を読み取ることができません」

答えて

関連する問題