使用jquery、javascript重新填充数据

Data repopulate using jquery, javascript

本文关键字：填充 数据 新填充 jquery javascript 使用      更新时间：2023-09-26

我在HTML页面中有一个类似下面的div：

当我点击任何div时，我将把span文本保存在DB中，当再次返回到同一页面时，我会得到作为保存文本的响应。基于文本，我需要重新填充单击的视图。

我正在添加我使用过的所有代码，无法填充数据。

<div class="panel-body">
    <div class='score score-exel'>
        <div class='arrow'></div><span class='scoreText'> 750-850 Excellent</span>
    </div>
    <div class='score score-good'>
        <div class='arrow'></div><span class='scoreText'> 700-749 Good</span>
    </div>
    <div class='score score-ok'>
        <div class='arrow'></div><span class='scoreText'> 650-699 OK</span>
    </div>
    <div class='score score-fair'>
        <div class='arrow'></div><span class='scoreText'> 600-649 Fair</span>
    </div>
    <div class='score score-poor'>
        <div class='arrow'></div><span class='scoreText'> 300-599 Poor</span>
    </div>
    <div class='btnHold'>
        <button class='btn btn-success idkBtn'>I Don't Know</button>
        <button class='btn btn-success submitBtn'>Submit</button>
    </div>
</div>

在下面的变量代码中，当用户单击div时，我将添加所选的值

$('.score').bind('click', function(){
    $('.arrow').hide();
    $(this).find('.arrow').fadeIn();
    userCreditScore = $(this).find('span').text().toString();
});

在下面的代码中，我得到了响应，并试图重新填充数据，但这是不可能的。

function fillData(){
    var response = nav.scorm.getResponse('CREDIT_SCORE');
    if(response != ''){
        var jsonData = jQuery.parseJSON(response);
          *** used many codes like below but not useful
//$('.score').find('span.scoreText:contains('+jsonData.CREDIT_SCORE+')').parent().css('display', 'block');
        //$('.score').find('span.scoreText:contains('+jsonData.CREDIT_SCORE+')').parent().click();
    }

如果是AJAX调用，我假设您的nav.scorm.getResponse方法中缺少回调。检查您的注释代码：

//here we do the request
var response = nav.scorm.getResponse('CREDIT_SCORE');
//this line and is executed immediately, while 'response' var is still undefined
    if(response != ''){

因此，根据你在nav.scorm.getResponse中的代码，你可能会有类似的smth

nav.scorm.getResponse('CREDIT_SCORE', function(response){
  if(response != ''){
    //put it to DOM
    console.log(response);
  }
});

UPD

问题是你的分数文本中的空格，' 600-649 Fair'不起作用，而'600-649 Fair'起作用。

检查这个小提琴-https://jsfiddle.net/shershen08/v3gxy8rL/

相关文章：