如果条件满足 jquery，则更改动态创建的按钮样式

Question

谁能告诉我我的代码有什么问题，每当我通过我自己创建的分页导航到另一个页面并返回到我已经单击一个按钮的上一页时（单击的按钮将具有引导程序的 btn-success 和一个选中的图标），我单击的按钮将使用其默认值，即 btn-primary。现在，每当我浏览不同的页面时，我想在 btn-success 上保持单击按钮的样式。谢谢。

for(var isbnCount=0; isbnCount<isbnsplitted.length; isbnCount++){
    if(value.ISBN==isbnsplitted[isbnCount]){
        console.log("true: "+isbnsplitted[isbnCount]);          
        checkBox='<td id="buttons">'+
                    '<input type="hidden" id="'+value.ISBN+value.Title+'">'+
                    '<button type="button" class="button btn btn-success" name="'+value.ISBN+'" id="'+value.ISBN+'" value="'+value.Title+'"><i class="material-icons">check</i></button>'+
                '</td>';
    }
    else{
        console.log("false");
        checkBox='<td id="buttons">'+
                        '<input type="hidden" id="'+value.ISBN+value.Title+'">'+
                        '<button type="button" class="button btn btn-primary" name="'+value.ISBN+'" id="'+value.ISBN+'" value="'+value.Title+'"><i class="material-icons">library_add</i></button>'+
                  '</td>';
    }
}   
}               
bookCards='<tr id="tableRow">'+
            '<td id="title">'+value.Title+'</td>'+
            '<td id="author">'+value.Author+'</td>'+
            '<td id="author">'+value.Category+'</td>'+
            status+
            checkBox+
      '</tr>';
$('#tableBody').append(bookCards);

顺便说一下，我正在从我的服务器端加载一组新数据，AJAX 代码位于那段代码之上。

Answer 1

在这种情况下，我想推荐使用 Redux（只是把它放在那里）。我现在一直在一些小应用程序上一起修改 JQuery 和 Redux，它们一起工作得非常好。

Redux 可以存储所有用户设置等，并消除了在 jQuery 函数周围传递变量的复杂性。但更重要的是，与存储变量等相比，Redux 存储可以轻松持久化和重新加载。我有一个 JsBin 工作示例here，它存储和重新加载加载 Redux 存储。

// Reducer - takes the action types and reduces them into a new state condition.
const text = (state = {}, actions) =>{
  switch (actions.type) {
    case 'UPDATE_TEXT': return Object.assign({}, state, {value: actions.value})
    default: return state
  }  
}

// Store to hold state of the app - only one store but many properties. 
const updateText = Redux.createStore(text);


//Use subscribe() to update the UI in response to state changes.
updateText.subscribe(() => {
  let text = updateText.getState().value
  localStorage.setItem("text",text)
  $('#display').text(text)
});


// The only way to mutate the internal state is to dispatch an action.
// Dispatch = "Please dispatch this change, please"
$('#square').on('keyup',(e) => updateText.dispatch({type:'UPDATE_TEXT','value':e.target.value}))

$(document).ready(()=>{
  console.log('working')
  let text = localStorage.getItem("text")
  updateText.dispatch({type:'UPDATE_TEXT','value':text})
})