2

Передача значения методом POST из <div class="text_color" name ="text2_color"></div>

У меня есть код на Javascript который находит ближайший похожий цвет и мне нужно после того как он его найдет найти его базы данных MySQL. Я хотел это сделать методом POST, только у меня не получается передать значение class="text_color". Как мне это сделать? Помогите пожалуйста.

    <?php
$db = mysql_connect('localhost', 'php_color', '12345');
mysql_query("SET NAMES 'cp1251'");
mysql_select_db("shedow",$db);

//$result = mysql_query("SELECT * FROM color_name WHERE HEX = '$hex'  OR H ='$h_r'  ORDER BY H,S,V") or die(mysql_error());
/*$result = mysql_query("SELECT DISTINCT English_name,Russian_name,HEX,HEX,R,G,B,C,M,Y,K,H,S,V, abs(r-$r)^2+abs(g-$g)^2+abs(b-$b)^2 b FROM color_name ORDER BY R,G,B ASC") or die(mysql_error());*/
$result = mysql_query("SELECT HEX FROM color  ") or die(mysql_error());
$myrow = mysql_fetch_array($result);

/*$options = '';
 do {
 $options .= printf ("%s,", $myrow['HEX']);
}
while($myrow =  mysql_fetch_array($result));
echo "$options";*/
$arr = array();

while($rows = mysql_fetch_array($result)){

    $arr[] = $rows[0];

}

?>
<script>
var r,g,b,base_colors, index;
$(document).ready(function(){
    function getSimilarColors (color) {
         base_colors = <?php echo json_encode($arr); ?>

        //Преобразование RGB, в R, G, B
        var color_rgb = hex2rgb(color);
        var color_r = color_rgb.split(',')[0];
        var color_g = color_rgb.split(',')[1];
        var color_b = color_rgb.split(',')[2];

        //Создание пустого массива для разности между цветами
        var differenceArray=[];

        //Функция ищет наименьшее значение в массиве
        Array.min = function( array ){
               return Math.min.apply( Math, array );
        };

        //Преобразование цвета HEX в массиве  RGB цветов, разделив их запятыми по R-G-B,  узнаем разницу между "цвет" и цветов в массиве
        $.each(base_colors, function(index, value) { 
            var base_color_rgb = hex2rgb(value);
            var base_colors_r = base_color_rgb.split(',')[0];
            var base_colors_g = base_color_rgb.split(',')[1];
            var base_colors_b = base_color_rgb.split(',')[2];

            //Добавить разницу в differenceArray
            differenceArray.push(Math.sqrt((color_r-base_colors_r)*(color_r-base_colors_r)+(color_g-base_colors_g)*(color_g-base_colors_g)+(color_b-base_colors_b)*(color_b-base_colors_b)));
        });

        //Получить наименьшее количество из differenceArray
        var lowest = Array.min(differenceArray);

        //Получить номер index для  lowest 
         index = differenceArray.indexOf(lowest);

        //Функция для преобразования HEX в RGB
        function hex2rgb( colour ) {
            //var r,g,b;
            if ( colour.charAt(0) == '#' ) {
                colour = colour.substr(1);
            }

            r = colour.charAt(0) + colour.charAt(1);
            g = colour.charAt(2) + colour.charAt(3);
            b = colour.charAt(4) + colour.charAt(5);

            r = parseInt( r,16 );
            g = parseInt( g,16 );
            b = parseInt( b ,16);
            return r+','+g+','+b;

        }

        //Возвращение HEX кода
        return base_colors[index];

    }

    //Только для демонстрации
    $('button').click(function(){        
        $('.base_color').css('backgroundColor',$('input').val());
        $('.nearest_color').css('backgroundColor','#'+getSimilarColors($('input').val()));
         $('.text_color').text(getSimilarColors($('input').val()));
        return false;
    });

});
//document.write(base_colors[index]);
//document.write('#'+getSimilarColors($('input').val()));
</script>

<p>
    <!--<input type="text" value="#5D8AA8"/>-->

    <input  type="text" maxlength="6" size="15" id="colorpickerField1" value="00ff00" />

    <button>Get the closest color</button> 
</p>

<p>Base color:</p>
<div class="base_color"></div>

<p>Closest color:</p>
<div class="nearest_color"></div>
<form action='search_color.php' method='post' name='form_s' align='left'>
<div class="text_color" name ="text_color"></div><br>
<span class="text_color" name ="text_color"></span><br>
<input  name='text_color' type='text'  style='width: 10%;' id='hex' /><br>
<input name='submit_s' type='submit' style='width: 20%;'value='Показать информацию о цвете' />
</form>

1 ответ 1

2

Рядом с кодом

$('.text_color').text(getSimilarColors($('input').val()));

добавь

$('.text_color').value(getSimilarColors($('input').val()));

В форму добавь

<input name="Замени_на_другой_name" class="text_color" type="hidden"/>

Это создаст скрытое поле в форме, которое не будет видеть пользователь. Но оно, будет заполнятся твоим скриптом (так как он заполняет по классам и именно для этого поля добавили заполнение value).

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.