2012-03-19 16 views
0

jqueryを新しくしました。ユーザーがリンクをクリックしてポップアップする警告ボックスを取得しようとしています。 下のリンクをクリックすると、警告メッセージが表示されません。cakephp jquery:リンクがクリックされたときに警告ボックスがポップアップしない

echo $this->Html->link('My Name', '#',array('id'=>'#MyName')); 
$this->Js->get('#MyName')->event('click',$this->Js->alert('whoa!'),array('wrap'=>false)); 

次は、上記のコードのソースを表示からである:

//<![CDATA[ 
$(document).ready(function() {$("#MyName").bind("click", alert("whoa!"););}); 
//]]> 
</script> 

次のビューソースからブラウザで生成されたHTMLです:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 

Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title> 
       Merry Parents </title> 
    <link href="/favicon.ico" type="image/x-icon" rel="icon" /><link href="/favicon.ico" type="image/x-icon" rel="shortcut icon" /><link rel="stylesheet" type="text/css" href="/css/cake.generic.css" /><script type="text/javascript" src="/js/jquery.js"></script> 
    <script type="text/javascript"> 
     /* $(document).ready(function() { 
       alert('JQuery is succesfully included'); 
     });*/ 
    </script> 

</head> 
<body> 
    <div id="container"> 
     <div id="header"> 
       <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" > 
<title>Untitled Document</title> 

</head> 

<body> 
<div> 
<div style="float:left; width:98%; background-color:#ffffff;"> 
<img src="/img/logo.png" alt="" /><div style="float:right; width:5%; top:100%; right:10%;"> 
<a href="/pages/home">Home</a></div> 
</div> 
</body> 
</html> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" > 
<title>Untitled Document</title> 
<link rel="stylesheet" type="text/css" href="/css/navbar.css" /> 
</head> 

<body> 
<div id="menu"> 
     <ul id="nav"> 
<!--  <li><a href="/pages/home">Home</a></li> 
-->   <li><a href="#">Our Program</a><ul> 
      <li><a href="/pages/preschool">Preschool</a></li> 
      <li><a href="/pages/kindergarten">Kindergarten</a></li> 
      <li><a href="/pages/summer_camp">Summer Camp</a></li> 
      </ul> 
      </li> 
      <li><a href="#">About Us</a><ul> 
      <li><a href="/pages/about_us">Merry Flowers</a></li> 
      <li><a href="/pages/tour_our_school">Tour Our School</a></li> 
      <li><a href="/pages/contact_us">Contact Us</a></li> 
      </ul> 
      </li> 

      <li><a href="#">My Child</a><ul> 
      <li><a href="/merry_parents/register">Report Card</a></li> 
      </ul> 
      </li> 

      <li><a href="#">Events</a><ul> 
      <li><a href="#">News &amp; Events</a>    <ul> 
        <li><a href="/pages/sports_day">Sports Day</a></li> 
        <li><a href="/pages/annual_day">Annual Day</a></li> 
       </ul> 
      </li> 

      <li><a href="/pages/list_of_holidays">List of Holidays</a></li> 
      </ul> 
      </li> 
      <li><a href="#">FAQ</a><ul> 
      <li><a href="/pages/faq">FAQ</a></li> 
      <li><a href="/feedbacks/add">Feedback</a></li> 
      <li><a href="/forum/home">Discussion</a></li> 
      </ul> 
      </li> 
      <li><a href="#">Admissions</a><ul> 
      <li><a href="/students/add">Enroll Now</a></li> 
      </ul> 
      </li> 
     </ul><!--finish ul nav--> 
     </div> <!--finish div menu--> 
</body> 
</html>  </div> <!-- finish div header --> 
     <div id="content"> 
      <div> 
      <div id="content1"> 

      <a href="#" id="#MyName">My Name</a>   </div> 
      <div id="content2"> 
       <a href="/students/add"><img src="/img/admission_open.gif" alt="admissions" /></a><img src="/img/contact_us.gif" alt="" />    
      </div> 
     </div> 
     </div> 
    <div id="footer"> 
     &copy; 2011 Merry Flowers Montessori | Designed by VRI Web 
    </div> 
</div><!--div container finish--> 
    <script type="text/javascript"> 
//<![CDATA[ 
$(document).ready(function() {$("#MyName").bind("click", alert("whoa!"););}); 
//]]> 
</script></body> 
</html> 

はあなたに感謝。

答えて

1
Try this 

IDセレクタについてもっと知ろ「MYNAME」記号 の前に#を削除するコードは次のようにする必要がありますエコー$ this-> Html-> link( 'My Name'、 '#'、array( 'id' => 'MyName'));

$(document).ready(function() { 
    $("#MyName").click(function(){  
    alert("whoa!"); 
    return false; 
    }); 
}); 
+0

ありがとうございました。 :) – vaanipala

+0

@ vaanipala ok良い – vicky

1

cakephpについては分かりませんが、生成されたjQueryコードは間違っています。あなたはID MyNameを持つ要素のclickハンドラをアタッチする場合

$("#MyName").bind("click", function (event) { 
    alert("whoa!"); 
    return false; 
}); 

here

+0

私はidを "#MyName"に変更しましたが、それでも動作しません。ポップアップアラートはありません。 – vaanipala

+0

@vaanipala:生成されたHTMLを共有できますか? – Nikhil

+0

はいすべての変更と生成された最新のhtmlで質問を更新しました。 – vaanipala

0
echo $this->Html->link('My Name', '#',array('id'=>'MyName')); 
$this->Js->get('#MyName')->event('click',$this->Js->alert('whoa!')); 

上記のコードは、警告メッセージをポップ。

$this->Js->get('#MyName')->event('click',$this->Js->alert('whoa!'),array('wrap',false)); 

は、私は匿名関数でラップされてからの警告メッセージを防ぐために使用されたアレイ(「ラップ」、false)を省略さ、仕事、そうしません。

次は、私は、ブラウザのソースになってるものです:

//<![CDATA[ 
$(document).ready(function() {$("#MyName").bind("click", function (event) {alert("whoa!"); 
return false;});}); 
//]]> 

trueにラップデフォルトはアラートのMSGを中心に機能(イベント)ラッピングを参照してfalseを返すことができますので。

関連する問題