0

こんにちは、かなり変更が必要な場所で入手したチャット スクリプトを作成しています。私が達成する必要がある機能は、ビューとチャットするユーザーの読み込みが成功した後、直接下に行く必要があります。私は何度か失敗したことをしましたが、自動で下に移動しますが、コンテンツをスクロールしようとすると、まだ下に戻りますが、これは起こるべきではありません。

これは私がこれまでに持っているものです。

    <?php
$ctr = 0;
if (is_array($buddies)) {
    foreach ($buddies as $buddy) {
?>
        <span style="float: right;"><?php echo $buddy->unreadMsgCtr; ?></span>
        &nbsp;<b><a href="#" class="username" id="friend<?php echo $ctr; ?>" chattingID="<?php echo $buddy->uidDetailsID?>"><?php echo humanize($buddy->fullName) ?></a></b> <br />
    <?php
            ++$ctr;
        }
    }
    ?>
<script type="text/javascript">
    $(document).ready(function() {
        <?php for ($ctrjs = 0; $ctrjs < $ctr; $ctrjs++) {?>
                    $('#friend' + <?php echo $ctrjs; ?>).live('click', function() {
                        $('#buddies').hide();
                        var chattingWith = $(this).attr('chattingID');

                        startrefresh();
                        $('#chatroom').show();
                        $('#chatmessage').html('<img src="<?php echo site_url('/images/ajax-loader.gif');?>" width="16" height="16" />');

                        $.post("<?php echo site_url('chats/chatbuddy');?>",{
                            username: $("#friend"+<?php echo $ctrjs; ?>).html(),
                            recipientID: chattingWith
                        });

                    });
        <?php } ?>
    });
</script>

//chats.php 特定の仲間がクリックされたとき。

 <script type="text/javascript">
var autoScrollEnabled = true;
    $(document).ready(function() {

        toggleAutoScroll();
        if(autoScrollEnabled == true) {
            $(".messages").animate({ scrollTop: $('.messages')[0].scrollHeight}, 1000);
            //return false;
            toggleAutoScroll();
        }

        function toggleAutoScroll() {
            autoScrollEnabled = !autoScrollEnabled; //! reverses the value, true becomes false, false becomes true
            if (autoScrollEnabled == true) { //scroll down immediately if a.s. is reenabled
                $(".messages").animate({ scrollTop: $('.messages')[0].scrollHeight}, 9999999999);
            }
        }

        $('#closechat').live('click', function() {
            $('#chatroom').hide();
            //scrolled = 0;
            stoprefresh();
        });
    });
</script>
<div class="headerchat" style="width: 217px;"><div class="buddycontainer">&nbsp;Chatting</div>
    <div class="closecontainer"><a href="#" id="closechat" class="close">&#x2716;</a>&nbsp;</div>
    <br class="breaker" />
</div>
<?php
if (is_array($chat)) {
    foreach ($chat as $item){ ?>
        <div class="conversation" style="width: 215px;">
        <b><span class="username"><?php echo $item['username']; ?></span></b>
        <span class="gray" style="float: right;" title="<?php echo date('M d, Y g:i A', $item['time']);?>">&nbsp;<?php echo date('g:i A', $item['time']);?></span>
        <br /><?php echo $item['message']; ?>
        </div>
    <?php } ?>
<?php }?>

ところで、これはjsfiddleで正しく動作していることを理解していないjsfiddleです。http://jsfiddle.net/STQnH/3/

正しい道を進んでいるかどうかはわかりません。私はそれを達成したいだけです。君たちありがとう。

4

1 に答える 1