2012-03-09 22 views
8

all. Ho creato un semplice programma di chat jQuery/PHP che funziona piuttosto bene. Tuttavia, mi piacerebbe aggiungere una funzione come canali o stanze. Idealmente, mi piacerebbe utilizzare le schede nella parte superiore della chat per gestire in quale stanza si trova l'utente (ci saranno solo 2). Ho pensato che sarebbe stato un compito semplice, e ho già visto qualcosa di simile prima, ma continuo a ricevere l'errore di eccezione non rilevato quando si fa clic sulle schede e l'origine non viene caricata correttamente. posterò il codice per l'intero sistema di chat, perché ho la sensazione che il problema potrebbe esserci.eccezione non rilevata: Schede UI jQuery: identificativo frammento non corrispondente

il jquery

page = { 
    getChat: function() { 
     $.ajax({ 
      url: 'game_src.php', 
      data: 'mode=getChat', 
      dataType: 'html', 
      cache: false, 
      success: function(res){ 
       $("#chatbox").html(res); 
      } 
     }); 
    } 
}; 

$("#submitmsg").click(function(){ 
    var clientmsg = $("#usermsg").val(); 
    $.ajax({ 
     url : 'game_src.php', 
     data: 'mode=chatSubmit&msg=' + encodeURIComponent(clientmsg) 
    }); 
    $("#usermsg").attr("value", ""); 
    return false; 
}); 

setInterval(page.getChat, 4000); 

$("#chatChannel").tabs({ 
    cookie: { expires: 1 }, 
}); 

corpo videochat

<?php 
if($user->data['user_id'] == ANONYMOUS) 
{ 

} 
else 
{ 
    ?> 
    <div id="chatChannel"> 
     <ul> 
      <li><a href="#global">Global</a></li> 
      <li><a href="#alli">Alliance</a></li> 
     </ul> 
    </div> 
    <form name="message" action=""> 
     <input name="usermsg" type="text" id="usermsg" size="25" /> 
     <input name="submitmsg" type="submit" id="submitmsg" value="Send" /> 
    </form> 
    <br /> 
    <?php 
} 
?> 
<div id="chatbox" style="border:1px solid black;background-color: rgba(255,255,255,0.3);height:400px;overflow:auto;"> 
    <div id="global"> 
    <?php 
    $chatMsgs = array(); 
    $limit = time()-86400; 

    $sql = 'SELECT COUNT(chat_id) as count FROM '.CHAT_TABLE.' WHERE chat_channel = 0 AND chat_time > '.$limit; 
    $result = $db->sql_query($sql); 
    $row = $db->sql_fetchrow($result); 
    $count = $row['count']; 

    if($count > 0) 
    { 
     $sql = 'SELECT * FROM '.CHAT_TABLE.' WHERE chat_channel = 0 AND chat_time > '.$limit.' ORDER BY chat_time DESC'; 
     $result = $db->sql_query($sql); 
     while($row = $db->sql_fetchrow($result)) 
     { 
      $chatMsgs[] = array(
       'chat_time' => $row['chat_time'], 
       'chat_msg' => $row['chat_msg'], 
       'chat_user' => $row['chat_user'], 
       'chat_channel' => $row['chat_channel'] 
      ); 
     } 

     foreach($chatMsgs as $msg) 
     { 
      $sql = 'SELECT username FROM '.USERS_TABLE.' WHERE user_id = '.$msg['chat_user']; 
      $result = $db->sql_query($sql); 
      $row = $db->sql_fetchrow($result); 
      $username = $row['username']; 

      echo '<div class="chatMsg" style="border-bottom:1px solid black;">'; 
      echo '<div class="chatUsr">'.$username.' says:</div>'; 
      echo '<div class="chatUsrMsg" style="float:left;">'.$msg['chat_msg'].'</div>'; 
      echo '<div class="chatMsgTime" style="float:right;">'.date("g:i a", $msg['chat_time']).'</div>'; 
      echo '</div>'; 
      echo '<br />'; 
      echo '<hr />'; 
     } 
    } 
    else 
    { 
     echo '<div class="chatMsg">Nothing is heard but the sound of crickets...</div>'; 
    } 
    ?> 
    </div> 
    <div id="alli"> 
    <?php 
    $chatMsgs = array(); 
    $limit = time()-86400; 

    $sql = 'SELECT COUNT(chat_id) as count FROM '.CHAT_TABLE.' WHERE chat_channel = 1 AND chat_time > '.$limit; 
    $result = $db->sql_query($sql); 
    $row = $db->sql_fetchrow($result); 
    $count = $row['count']; 

    if($count > 0) 
    { 
     $sql = 'SELECT * FROM '.CHAT_TABLE.' WHERE chat_channel = 1 AND chat_time > '.$limit.' ORDER BY chat_time DESC'; 
     $result = $db->sql_query($sql); 
     while($row = $db->sql_fetchrow($result)) 
     { 
      $chatMsgs[] = array(
       'chat_time' => $row['chat_time'], 
       'chat_msg' => $row['chat_msg'], 
       'chat_user' => $row['chat_user'], 
       'chat_channel' => $row['chat_channel'] 
      ); 
     } 

     foreach($chatMsgs as $msg) 
     { 
      $sql = 'SELECT username FROM '.USERS_TABLE.' WHERE user_id = '.$msg['chat_user']; 
      $result = $db->sql_query($sql); 
      $row = $db->sql_fetchrow($result); 
      $username = $row['username']; 

      echo '<div class="chatMsg" style="border-bottom:1px solid black;">'; 
      echo '<div class="chatUsr">'.$username.' says:</div>'; 
      echo '<div class="chatUsrMsg" style="float:left;">'.$msg['chat_msg'].'</div>'; 
      echo '<div class="chatMsgTime" style="float:right;">'.date("g:i a", $msg['chat_time']).'</div>'; 
      echo '</div>'; 
      echo '<br />'; 
      echo '<hr />'; 
        } 
    } 
    else 
    { 
     echo '<div class="chatMsg">Nothing is heard but the sound of crickets...</div>'; 
    } 
    ?> 
    </div> 
</div> 

ho intenzione di aggiungere un parametro alla funzione getChat jquery per passare avanti e indietro, ma con quello che ho, i' m bloccato Qualcuno può indicarmi la giusta direzione?

risposta

14

Il plugin per le schede dell'interfaccia utente JQuery prevede che il contenuto div s si trovi nello stesso contenitore del collegamento ul.

Nel tuo caso, si aspetta che il contenuto div s di essere nella div id="chatChannel" proprio sotto la ul, ma non sono lì.

+0

Nel mio mio codice div sono giustamente annidati. dove altro potrebbe essere il problema? – softwareplay

-3

Ho riscontrato questo problema durante l'implementazione delle schede dell'interfaccia utente jquery in un'applicazione jQuery Mobile. utilizzando

jQuery 1.7.2

jQuery UI 1.8.2

jQuery Mobile 1.1.

Aparentry il problema sono le versioni di compatibilità tra jQuery UI e le versioni jQuery Mobile.

Dopo aver letto la segnalazione del bug di evry e il passaggio tra le versioni di libreria di jQuery, ho trovato la soluzione downgrade alla versione 1.0.1 di jQuery Mobile che non entrava in conflitto con il componente delle schede dell'interfaccia utente jQuery.

speranza che gli sviluppatori di jQuery Mobile fissare questo per le future versioni

Problemi correlati