html onclick не работает при передаче функции

Question

Я знаю, что на этом есть некоторые сообщения, но ни один из них не подходит для того, что я точно ищу.

Я создаю простую версию твиттера. Моя цель здесь - щелкнуть по ручке пользователя (пользовательская ссылка), а затем отобразить все их твиты. Я использую html onclick и передаю функцию, но это отображается: @ [object Object], [object Object]: [object Object], [object Object] [object Object], [object Object], [object Object]

Все твиты вырываются, но теперь нет твитов. похоже, что в консоли js я получаю нужные объекты (твиты человека), но они просто не отображаются на странице правильно. Знаете ли вы, что должно произойти здесь? любая помощь в правильном направлении была бы потрясающей.

Вот мой соответствующий код:

var tweetCount; 
    var newCount; 

    var initialTweets = function() { 
    tweetCount = streams.home.length; 
    for(var i = 0; i < tweetCount; i++) { 
     var tweet = streams.home[i]; 
     displayTweet(tweet); 
    } 
    }; 

    var extraTweets = function() { 
    newCount = streams.home.length; 
    for(var i = tweetCount; i < newCount; i++) { 
     var tweet = streams.home[i]; 
     displayTweet(tweet); 
    } 
    tweetCount = newCount; 
    }; 


    var displayTweet = function(tweet) { 
    var $tweet = $('<div></div>'); 
    var userLink = "<a href='#' onclick='displayUserTweets("+ tweet.user +")'>" + tweet.user + "</a>"; 
    $tweet.html('@' + userLink + ': ' + tweet.message + ' ' + tweet.created_at); 
    $('#tweetContainer').prepend($tweet); 
    }; 

    var displayUserTweets = function(user) { 
    $('#tweetContainer').html('<div></div>'); 
    var $userTweets = $('<div></div>'); 
    var userTweets = streams.users[user]; 
    $userTweets.html('@' + userTweets.user + ': ' + userTweets.message + ' ' + userTweets.created_at); 
    $('#tweetContainer').prepend($userTweets); 
    }; 

    initialTweets(); 

    $(document).ready(function(){ 
    $('button').on('click', function() { 
     extraTweets() 
    }); 
    }); 

Answer 1

Вы передаете пользователя как OnClick обработчик здесь, которая должна быть функция JavaScript.

var userLink = "<a href='#' onclick='"+ tweet.user +"'>" + tweet.user + "</a>"; 

"tweet.user" он должен быть Javascript имя функции, как показано ниже:

function showUserTweets(username) { 
    // write you logic here to get the user tweets by using his username; 
} 

поэтому вы код будет выглядеть как-то ниже:

var userLink = "<a href='#' onclick='showUserTweets(\""+ tweet.user +"\")'>" + tweet.user + "</a>"; 

Примечание : Вы tweet.user должны возвращать значение String. Для объекта вы преобразовали свой объект в строку JSON с помощью метода JSON.strigify(object).

Надеюсь, это поможет вам!

Answer 2

Как я понял, вы передаете переменную в onclick. который не является допустимым методом. так что tweet.user не является допустимым методом.

var displayTweet = function(tweet) { 
    var $tweet = $('<div></div>'); 
    var userLink = "<a href='#' onclick='"+ tweet.user +"'>" + tweet.user + "</a>"; 

    $tweet.html('@' + userLink + ': ' + tweet.message + ' ' + tweet.created_at); 
    $('#tweetContainer').prepend($tweet); 

    }; 

Здесь я пишу решения: Во-первых, создать функцию

function yourFunction(){ 

    // do your stuff 
    } 

Тогда вы можете позвонить, используя один из следующих заменить строку:

var userLink = "<a href='#' onclick='"+ tweet.user +"'>" + tweet.user + "</a>"; 

к этому

var userLink = "<a href='javascript:void(0);' onclick='yourFunction('+"'"+ tweet.user +"'"+")'>" + tweet.user + "</a>"; 

ИЛИ

var userLink = "<a href='javascript:yourFunction('+"'"+tweet.user+"'"+');' 

и удалить эти функции