Ajax jQuery Лучшие практики: избегать встроенного скрипта?? тогда как мне передать переменные

Question

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

Тем не менее, я хочу спросить, что мне делать, если мне нужно передать серверные переменные в JavaScript. Вроде рассмотрим следующий код...

<?php foreach($product as $product_id): ?>
<input type="button" value="Delete Favorite" onclick="delete_favorite('<?php echo $product_id; ?>')" />
<?php endforeach; ?>

Должен ли я использовать скрытые значения формы для такого случая? или может быть добавление добавления серверной переменной в id элемента, для которого я определяю поведение? вот так..

<input type="button" value="Delete Favorite" id="button<?php echo $product_id; ?>" />

Какие-либо предложения?

Answer 1

Есть несколько вещей, которые вы можете сделать, одним из них будет использование специального атрибута, такого как data-product-id (data- Префикс в спецификации HTML5, я верю).

Тем не менее, вы могли бы также дать это input id такие как product-343 а затем получить идентификатор с помощью...

$(this)[0].id.replace(/\D/g, '');

(предполагать this указывает на input элемент).

Answer 2

Использование data- атрибут префикса. http://jsfiddle.net/zJWfB/

Answer 3

Попробуй это:

<?php foreach($product as $product_id): ?>
    <input id="fav-<?php echo $product_id; ?>" class="prod-fav" type="button" value="Delete Favorite"/>
<?php endforeach; ?>

<script type="text/javascript">
    $(function(){
        $(".prod-fav").click(function(){
                    var $this = $(this);
            var id = $(this).attr("id").replace(/[^0-9]/g, "");
            delete_favorite(id); // Call delete_favorite or
                    //delete_favorite.call($this, id); //To retain the calling element context or
                    // implement you delete function right here..
        });
    });

</script>